新手问题 (前端) 求教一个标题栏的写法

cqcn1991 · 2014年10月19日 · 最后由 debugger 回复于 2014年10月20日 · 1684 次阅读

这是新浪体育的移动端网页 如图,指的是最上面的【国际足球 英超 西甲】那一行,源码如下 也就是大致这样:

<h1>
  <span>国际足球</span>
  <a href="">欧冠</a>
  <a href="">西甲</a>
</h1>

觉得这种写法挺奇怪的,h1 里面再放小内容?还是这种写法是业内 practice 惯例? 比较好的写法是咋样?

一般用 nav 或者干脆用 div 都可以。这个没什么特别的要求,css 样式写的简洁就好。

按照规范里的定义,<h1> 里面可以放大部分 inline element,比如在你你的例子里 <span> 就是可以的。

但是 <a> 是一个例外,尽管所有的浏览器里它都是默认行内元素。如果标题同是也是超文本链接,则应该把 <a> 放置在 <h1> 的外部。

不过呢,从这里也就看出 HTML 的容错性有多强了,或者说各浏览器有多宽松。

h1 太重要了,就放文字就好了。

#3 楼 @debugger 那这种横式的排版一般咋写?h1 不是都占一整行嘛…

#4 楼 @cqcn1991 我也没搞明白这里为啥用 h1 来实现,h1 对 seo 很重要,就表示这个页面的主题性的东西,1 个页面只用 1 次。不过大网站不需要 seo,无所谓吧。

需要 登录 后方可回复, 如果你还没有账号请 注册新账号