当前位置: 电脑软硬件应用网 > 设计学院 > 网络编程 > XML与XHTML教程 > 正文 |
|
|||
不太常用的XHTML标签用法以及实例 | |||
2010-1-5 9:58:41 文/佚名 出处:互联网 | |||
做为 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 软件” 代码: 其中的 title 属性就是放置缩写文本的完整内容,它可以被 浏览器、拼写检查程序、翻译系统以及搜索引擎分度器 所解析。 页面呈现效果: “熟练使用 PSPS、DWDW 软件” 2. <acronym></acronym>——取首字母缩写 举例: 在我们熟知的语言中,诸如:HTML、CSS,这二个单词也是缩写,完整的英文是: HTML:Hypertext Markup Language CSS:Cascading Style Sheets 很明显,上面这二句每个单词的首字母合在一起,变成了我们最常见到的 HTML、CSS,那么当我们在页面中要呈现这些首字母缩写的文本时,可以编写如下代码: <acronym title <acronym title 页面呈现效果: 3. <address></address>——定义地址、签名或者文档的作者身份 举例:妙味课堂所在地:北京海淀区牡丹园小区北里1号楼811室 代码:<address>妙味课堂所在地:北京海淀区牡丹园小区北里1号楼811室</address> 注意:这个标签是块级元素(block) 页面呈现效果: 妙味课堂所在地:北京海淀区牡丹园小区北里1号楼811室 <q></q>——定义一个短引用 我们的页面上有可能会引用一段文字、某人的一句话等等,最常见的是在正文之前,有一块“引用”的简短内容,在这个时候,就需要用到这二个标签。 举例: 长的引用: 短的引用: 注意:blockquote 标签会在文本的两端产生缩进。 页面呈现效果: 长的引用: 除非你把爱国主义从人类中驱逐出去,否则你将永远不会拥有一个宁静的世界。爱国主义是一种有害的、精神错乱的白痴形式。爱国主义就是让你确信这个国家比所有其他的国家都要出色,只因为你生在这里。——乔治•肖伯纳 短的引用: 5. <del></del>——定义文档中已被删除的文本 <ins></ins>——定义已经被更新的文本 举例: 经常有商城类网站的促销价,原价是:50元,现价是:42元 代码:原价是:<del>50元</del>,现价是:<ins>42元</ins> 页面呈现效果:原价是:50元,现价是:42元 6. <sub></sub>——定义下标文本 <sup></sup>——定义上标文本 这二个标签在数学里经常用到。 举例:10<sub>2</sub> 10<sup>2</sup> 页面呈现效果:102 102 看到这里,会不会有人认为:“这样做不就把一件很简单的事情复杂化了吗?” ——其实这样想是不对的,原因除了上面提到过的语义化原则以外,还应当考虑这句话: “(当你合理运用这些标签的时候)浏览器可能会根据这个信息,改变对这些文本的显示方式,或者用其他文本代替。也许当前流行的浏览器对此标签中包含的文本还没有任何处理方式,但是我们无法预测将来的浏览器版本将会如何实现该标签。” 另外,还有一些更实际的应用促使我们将代码写得更严谨些: 假如我们希望加上一点 JSJS 的页面展示效果:当鼠标移动到页面中任何一个 abbr 标签内时,有一个图片会随着鼠标渐渐显示出来,并且图片上的说明文字,就是 abbr 标签内的 title 内的文字; 由于我们一开始就在页面中设置好了 abbr 标签,所以即使在页面完成以后,要添加这样的页面效果,也是易如反掌、轻松之至。 |
|||
最新热点 | 最新推荐 | 相关文章 | ||
使用Table,DIV,XHTML三者制作网页… 一分钟制作XHTML网页:XHTML新手学习… XHTML教程:针对初学者的XHTML基础 使用W3C验证XHTML常见的5个错误 HTML、XHTML和XML的比较 |
关于45IT | About 45IT | 联系方式 | 版权声明 | 网站导航 | |
Copyright © 2003-2011 45IT. All Rights Reserved 浙ICP备09049068号 |