课程咨询 :15265420612 QQ:2720475033

潍坊java培训 > 达内新闻 > 语义化你的HTML标签和属性
  • 语义化你的HTML标签和属性

    发布:潍坊java培训机构      来源:潍坊java培训机构      时间:2015-12-12

  • 语义化你的HTML标签和属性

    分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个 XHTML 元素的存在就意味被标记内容的那部分有相应的结构化的意义,没有理由使用其他的标记。换句话说,不要让 CSS 使一个 HTML 元素看起来就像另一个 HTML 元素,比如用

    来代替

    标记标题。

    首先是关于语义(Semantics)和默认样式的区别,默认样式是浏览器设定的一些常用tag的表现形式,个人认为他的主要目的就是让大家直观的认识标签(markup)和属性(attribute)的用途和作用,很明显Hx系列看起来很像标题,因为拥有粗体和较大的字号。,用来区别于其他文字,起到了强调的作用。至于列表和表格很明显的告诉你他们是做什么的。

    其次,语义化的网页的好处,最主要的就是对搜索引擎友好,又了良好的结构和语义你的网页内容自然容易被搜索引擎抓取,你网站的推广便可以省下不少的功夫。

    具体的语义和用途在,XHTML1.0 TAG 参考中都已经说明,这里将一些容易遗忘或者混淆的TAGS和属性予以补充。

    ,作为标题使用,并且依据重要性递减。

    是最高的等级。

    例如:

    CODE:

    文档标题

    次级标题

    而不要使用

    文档标题

    ,或者文档标题.很明显搜索引擎对于后者是不会认为他是标题的。

    段落标记,知道了

    作为段落,你就不会再使用

    来换行了,而且不需要

    来区分段落与段落。

    中的文字会自动换行,而且换行的效果优于

    。段落与段落之间的空隙也可以利用CSS来控制,很容易而且清晰的区分出段落与段落。在利用行高(line-height)很容易的定义出行间距,再定义首字下沉等效果,那就挺完美了。

    例如:

    CODE:

    多年来,蓝色理想的内容不断充实,先后被国内一些知名网站、传统媒体重点推介过,并陆续被Google、百度、雅虎、搜狐、新浪、Excite等各大搜索站点收藏,并在Google、百度、Yahoo三大搜索引擎中以简体汉字关键词"网站设计与开发”搜索排名均为第一,现在蓝色理想已发展成为国内影响最大的网站设计、开发的专业网站之一。<

    无序列表,很常见的到了大家广泛的使用,

    有序列表也挺常用。在web标准化过程中,

    还被更多的用于导航条,本来导航条就是个列表,这样做是完全正确的,而且当你的浏览器不支持CSS的时候,导航链接仍然很好使,就是美观方面差了一点。

    例如:

    CODE:

    项目一

    项目二

    项目三

    CODE:

    第一章

    第二章

    第三章

    语义化你的HTML标签和属性

    分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个 XHTML 元素的存在就意味被标记内容的那部分有相应的结构化的意义,没有理由使用其他的标记。换句话说,不要让 CSS 使一个 HTML 元素看起来就像另一个 HTML 元素,比如用

    来代替

    标记标题。

    首先是关于语义(Semantics)和默认样式的区别,默认样式是浏览器设定的一些常用tag的表现形式,个人认为他的主要目的就是让大家直观的认识标签(markup)和属性(attribute)的用途和作用,很明显Hx系列看起来很像标题,因为拥有粗体和较大的字号。,用来区别于其他文字,起到了强调的作用。至于列表和表格很明显的告诉你他们是做什么的。

    其次,语义化的网页的好处,最主要的就是对搜索引擎友好,又了良好的结构和语义你的网页内容自然容易被搜索引擎抓取,你网站的推广便可以省下不少的功夫。

    具体的语义和用途在,XHTML1.0 TAG 参考中都已经说明,这里将一些容易遗忘或者混淆的TAGS和属性予以补充。

    ,作为标题使用,并且依据重要性递减。

    是最高的等级。

    例如:

    CODE:

    文档标题

    次级标题

    而不要使用

    文档标题

    ,或者文档标题.很明显搜索引擎对于后者是不会认为他是标题的。

    段落标记,知道了

    作为段落,你就不会再使用

    来换行了,而且不需要

    来区分段落与段落。

    中的文字会自动换行,而且换行的效果优于

    。段落与段落之间的空隙也可以利用CSS来控制,很容易而且清晰的区分出段落与段落。在利用行高(line-height)很容易的定义出行间距,再定义首字下沉等效果,那就挺完美了。

    例如:

    CODE:

    多年来,蓝色理想的内容不断充实,先后被国内一些知名网站、传统媒体重点推介过,并陆续被Google、百度、雅虎、搜狐、新浪、Excite等各大搜索站点收藏,并在Google、百度、Yahoo三大搜索引擎中以简体汉字关键词"网站设计与开发”搜索排名均为第一,现在蓝色理想已发展成为国内影响最大的网站设计、开发的专业网站之一。<

    无序列表,很常见的到了大家广泛的使用,

    有序列表也挺常用。在web标

上一篇:关于XHTML的H1标记的位置

下一篇:target 属性怎么用 JS 来控制?

最新开班日期  |  更多

Java--零基础全日制班

Java--零基础全日制班

开班日期:2月15日

Java--大数据周末班

Java--大数据周末班

开班日期:2月15日

Java--大数据全日制班

Java--大数据全日制班

开班日期:2月15日

Java--零基础周末班

Java--零基础周末班

开班日期:2月15日

  • 地址:潍坊中心地址:潍坊市奎文区东风东街299号建行大厦五层 电话:0536-8222150
    临沂中心地址:临沂市兰山区红旗路1号苏宁易购四楼 电话:0539-7205599
    淄博市张店区金晶大道68号华润大厦25层 电话:18005330180
  • 课程培训电话:15265420612 QQ:2720475033     全国服务监督电话:400-827-0010
  • 服务邮箱 ts@tedu.cn
  • 2001-2016 达内时代科技集团有限公司 版权所有 京ICP证8000853号-56