龙空技术网

Html知识点之各类标签语义化解释

陕西IT优就业 32

前言:

此刻同学们对“html废除的标签”大体比较重视,各位老铁们都需要了解一些“html废除的标签”的相关内容。那么小编也在网摘上收集了一些对于“html废除的标签””的相关知识,希望你们能喜欢,姐妹们快快来学习一下吧!

对于学习Web前端开发的小伙伴来说,掌握HTML是基本功,今天陕西优就业小编就为大家带来HTML中各类标签语义化的解释。

1.p标签和br标签

先说个最简单的。分段要用p标签而不是用br(甚至连续两个)。这个似乎不用多说。但是有时候我们不得不放弃这个原则。一个常见的例子是论坛发帖,如果我想分段,便打回车。而如此传输到后台并显示出来的,显然就是用分段的。

2.table 和 th

由于大力宣扬div+css的结果,似乎现在谁用table布局谁就是未开化的土著。但我认为这种观点是不正确的。table的含义是表格,因此凡是应该以表格形式出现的数据,仍然应该用table布局。简单的例子是班级同学的花名册,包括姓名学号性别等等,这明显是一个表格形式的数据,因此应该用table布局。另一个比较值得探讨的例子是,blog里面的日历导航。我曾经有见过一个blog程序,它的日历导航里的各个日期,从1号到30号全用div套好,再使用float:left样式7个一排的排出当月的日历。当我取消浏览器的CSS显示之后,日历的那部分则从1号到30号一竖排下来。我认为这是不对的。因为日历应该是一个表格形式的数据,因此仍然应该用table布局。当取消css之后,应该仍然按照一排7个的样子归成一个表格。

th则是另一个会被忽视的标签。由于CSS的万能,所有的表格单元都可以用td加一个class属性搞定。但是从语义上讲,一些表格单元应该用th标签。比如上文说到的日历表格,里面的“MON TUE WED... SUN”这些标识星期的单元,就应该用th而不是td。

3.h1-h6

对于h1-h6标签,从语义上讲,它们应该适用于所有标题文字。因此,一些如但是值得注意的是,这样又有可能犯之前h1里面提到的问题。因为有些文字的样式其实是有现成的标签的,比如 strong 标签 sub标签 等,我们也应该适当的给它们一些机会。

4.a标签

a是控制超连接的标签。但有些特殊的情况,我们不一定喜欢用它。比如需要弹出一个小窗口。我没怎么留心,但我想有些设计师会将onclick直接定义到“播放”小图标的标签里还是应该在img外面加一个a,然后将onclick定义到a里面,并记住在js函数最后写上return false。如果可以,该a标签的href属性也应该写上弹出窗口的URL,保证用户在禁止JS的情况下仍能够有效的打开页面。

暂时介绍这么多最后再总结一下遵循HTML标签语义的重要性。Web标准的其中一个要求是低配置的兼容性:当用户禁用图片、禁用CSS或禁用JS的时候,我们仍能够让他有效的浏览网页内容。众所周知强制alt属性就是为禁用图片时的兼容性作考虑。而正确的遵循HTML标签的语义,则是保证禁用CSS时的兼容性。只有当正确使用了HTML标签,我们的网页在“CSS裸奔”的时候,才会仍然让人看得出哪里是导航菜单,哪里是文章标题,日历表格也不会分崩离析。

陕西优就业Web前端学习:

标签: #html废除的标签