日期:2014-01-01  浏览次数:20636 次

网页制造aiyiweb文章简介:只需制造出来的页面能够和设计效果图分歧就行了,管它代码合理不合理、严谨不严谨,客户也不要求页面通过 W3C 验证.

做为 XHTML+CSS 开发人员,尽可能不要让本人有这样的念头:

“只需制造出来的页面能够和设计效果图分歧就行了,管它代码合理不合理、严谨不严谨,客户也不要求页面通过 W3C 验证……”

——我们的目的是为了要写出尽量语义正确的合格文档,而不是为了要通过什么验证,假如一点也不考虑代码的语义性,仅仅要求能还原效果图就好,就又退回到 table 时代了~~那下面的文字内容,也不必再看下去了。

举一个例子:

当我们回到家当前,会把脱下来的鞋放到鞋柜,把买回来的肉放进冰箱,我们这些做法肯定不会乱来:把臭鞋放进冰箱,把肉搁进鞋柜?!

标签也是这个道理,相关的内容要放入到合适的标签内,比如主标题就放到 h1 标签里,p 标签内装的就是文本段落,这样做,不是为了给人看的,而是要给那些:浏览器、拼写检查程序、翻译系统以及搜索引擎分度器看,毕竟最终解析这些代码的是机器。所以我们还是用机器的言语来跟机器沟通吧!

认同以上观点的,请继续往下看:

今天要说的不是那些常见标签(如:div、h1、p、dl、ul、ol、strong、span……),而是一些不太常用的标签(“不太常用的标签” 这个说法仅仅是团体定义),如今就大致引见一下:

1. <abbr></abbr> ——这个标签是用来包含缩写的文本

举例:

“熟练使用 PS、DW 软件”

这一句话实际要表达的是:“熟练使用 Adobe Photoshop CS4、Adobe Dreamweaver CS4 软件”

代码:
<p>“熟练使用 <abbr title=’Adobe Photoshop CS4′>PS</abbr>、<abbr title=’Adobe Dreamweaver CS4′>DW</abbr> 软件”</p>

其中的 title 属性就是放置缩写文本的完整内容,它可以被 浏览器、拼写检查程序、翻译系统以及搜索引擎分度器 所解析。

页面呈现效果:

“熟练使用 PSPS、DWDW 软件”

2. <acronym></acronym>——取首字母缩写

举例:

在我们熟知的言语中,诸如:HTML、CSS,这二个单词也是缩写,完整的英文是:

HTML:Hypertext Markup Language

CSS:Cascading Style Sheets

很明显,上面这二句每个单词的首字母合在一同,变成了我们最常见到的 HTML、CSS,那么当我们在页面中要呈现这些首字母缩写的文本时,可以编写如下代码:

<acronym title="Hypertext Markup Language">HTML</acronym>

<acronym title="Cascading Style Sheets">CSS</acronym>

页面呈现效果:HTML CSS

3. <address></address>——定义地址、签名或者文档的作者身份

举例:妙味课堂所在地:北京海淀区牡丹园小区北里1号楼811室

代码:<address>妙味课堂所在地:北京海淀区牡丹园小区北里1号楼811室</address>

留意:这个标签是块级元素(block)

页面呈现效果:

妙味课堂所在地:北京海淀区牡丹园小区北里1号楼811室

4. <blockquote></blockquote>——定义一个块援用(长段文字援用)

    <q></q>——定义一个短援用

我们的页面上有可能会援用一段文字、某人的一句话等等,最常见的是在注释之前,有一块“援用”的简短内容,在这个时候,就需求用到这二个标签。

举例:

长的援用:
<blockquote>
除非你把爱国主义从人类中驱逐出去,否则你将永远不会拥有一个宁静的世界。爱国主义是一种无害的、精神错乱的白痴方式。爱国主义就是让你确信这个国家比所有其他的国家都要出色,只由于你生在这里。——乔治•肖伯纳
</blockquote>

短的援用:
<q>有这么一群人,在日本叫法西斯,在德国叫纳粹,在中国叫爱国者! ——王朔说</q>

留意:blockquote 标签会在文本的两端产生缩进。

页面呈现效果:

长的援用:

除非你把爱国主义从人类中驱逐出去,否则你将永远不会拥有一个宁静的世界。爱国主义是一种无害的、精神错乱的白痴方式。爱国主义就是让你确信这个国家比所有其他的国家都要出色,只由于你生在这里。——乔治•肖伯纳

短的援用:
有这么一群人,在日本叫法西斯,在德国叫纳粹,在中国叫爱国者! ——王朔说 

5. <del></del>——定义文档中已被删除的文本

    <ins></ins>——定义曾经被更新的文本

举例:

经常有商城类网站的促销价,原价是:50元,现价是:42元

代码:原价是:<del>50元</del>,现价是:<ins>42元</ins>

页面呈现效果:原价是:50元,现价是:42元

6. <sub></sub>——定义下标文本

    <