html标签语义化

1.强调

<strong> 标签和 <em> 标签一样,用于强调文本,但strong强调的程度更强一些。

em强调在浏览器解析下默认为斜体,虽然<i>标签也是斜体的效果,但是em才具有语义化。

2.引用

用<q>标签的真正关键点不是它的默认样式双引号,是它的语义:引用别人的话(短文本的引用)

<blockquote>的作用也是引用别人的文本。但它是对长文本的引用,如在文章中引入大段某知名作家的文字,这时需要这个标签。浏览器对<blockquote>标签的解析是缩进样式。

区别:

一、格式不同
1、<q>:q标签是行内元素,在内容的开始和结尾处会包有【“”】;
2、<blockquote>:blockquote是块级元素,默认带有左右40px的外间距,不带【“”】。

二、语义不同
1、<q>:引用的是小段文字;
2、<blockquote>:引用的是大段的内容块。

3.地址

 一般网页中会有一些网站的联系地址信息需要在网页中展示出来,这些联系地址信息如公司的地址就可以<address>标签。也可以定义一个地址(比如电子邮件地址)、签名或者文档的作者身份。 在浏览器上显示的样式为斜体

4.代码

在网页中显示一行代码时,使用code标签,

在网页中显示多行代码时,使用pre标签。(pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。)但是pre所包含的内容不一定就是代码。

如果您希望使用 <pre> 标签来定义计算机源代码,比如 HTML 源代码,请使用符号实体来表示特殊字符,比如 "&lt;" 代表 "<","&gt;" 代表 ">","&amp;" 代表 "&"。

5.表格

<table summary="...">: 摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化),使搜索引擎更好的读懂表格内容,还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。 

<caption>..</caption>:   表格的标题,默认正上方居中

 

posted @ 2016-08-02 23:51  swii  阅读(164)  评论(0编辑  收藏  举报