HTML5 标签 hgroup 已经被废除

程序人生

HTML5 增加了很多语义化的标签,hgroup 就是其中一个,它用来表明标题的集合。如果有主标题、副标题,可以使用这个来包裹一下,一般比较常见的就是网站的标题和网站描述:

但是这样做并不是太必要,而且还有一些麻烦。一般来说,很难有单纯的 hn 标题标签集合在一起,通常还包含一些其他内容,但是使用 hgroup 包裹的内容,必须是 hn 标题标签,否则不会通过 HTML5 验证。又有谁会为了这么一个增强语义性用处不大的标签专门去生成一堆 hn 标签?

然后好消息是,这个标签在最新的 HTML5.1 版中被废除了,以后可以不再用了。但是又面临了一些问题,如果我有类似这种 声明主标题和对应副标题说明 的需求,我应该怎样增强语义性?

用其他方法模拟 hgroup 的语义性

使用标点符号分割

最简单的方法就是使用标点符号分割主标题和副标题:

<h1>岁月轻狂: 从前的少年。</h1>

这种类型比较适合于文章标题,很显然不适合网站标题。 

 使用 span 标签标注副标题说明

<h1>岁月轻狂
   <span>从前的少年。</span> 
</h1>

这种方式比上面好一点,但是感觉还是怪怪的,但是结构比较简单,如果不怕麻烦,推荐下面一种方法。 

使用 header 标签包裹标题和描述 header 也是 HTML5 新增的语义性标签,用来表示头部信息,一般不会被废弃。我们可以这样做:

<header>
<h1>岁月轻狂</h1>
<p>从前的少年。</p>
</header>

推荐这种写法,在保证了语义性的同时,也保证了代码的整洁。

Tags: HTML5
转自:http://www.qianxingzhem.com/post-1882.html
  • 还没有评论,沙发等你来抢
*         

正在加载验证码......