这是新浪体育的移动端网页 如图,指的是最上面的【国际足球 英超 西甲】那一行,源码如下 也就是大致这样:
<h1> <span>国际足球</span> <a href="">欧冠</a> <a href="">西甲</a> </h1>
觉得这种写法挺奇怪的,h1 里面再放小内容?还是这种写法是业内 practice 惯例? 比较好的写法是咋样?
一般用 nav 或者干脆用 div 都可以。这个没什么特别的要求,css 样式写的简洁就好。
按照规范里的定义,<h1> 里面可以放大部分 inline element,比如在你你的例子里 <span> 就是可以的。
<h1>
<span>
但是 <a> 是一个例外,尽管所有的浏览器里它都是默认行内元素。如果标题同是也是超文本链接,则应该把 <a> 放置在 <h1> 的外部。
<a>
不过呢,从这里也就看出 HTML 的容错性有多强了,或者说各浏览器有多宽松。
h1 太重要了,就放文字就好了。
#3 楼 @debugger 那这种横式的排版一般咋写?h1 不是都占一整行嘛…
#4 楼 @cqcn1991 我也没搞明白这里为啥用 h1 来实现,h1 对 seo 很重要,就表示这个页面的主题性的东西,1 个页面只用 1 次。不过大网站不需要 seo,无所谓吧。