|
上文：Chapter 3 邪恶的表格？
标准化设计解决方案 - 标记语言和样式手册
Web Standards Solutions The Markup and Style Handbook
Part 1: Get Down With Markup 从标记语法谈起
Chapter 4 引用
“Misquotations are the only quotations tha are never misquoted” (只有错误的引用永远不会被误用)——Hesketh Pearson
所有类型的网站都经常会使用引用，不管是引用其他网页、作者或出版物的内容，以标准方法标记引用内容是非常有好处的。因为一旦完成结构之后，只需要一些简单的css就能把引用内容变成漂亮的设计元素。
让我们看看下面三种用来标记引言的方法，同时讨论一下每个方法的优缺点，在我们找到最棒的方法之后，再来研究这几个相关元素与样式在标记冗长引用内容时哪种方法最佳。
我们来仔细研究每个方法，并且找到最便于完成任务的“工具”，更重要的是，要弄清楚为什么它是最棒的工具。
方法A：缺乏语义
<p>"Misquotations are the only quotations that are never misquoted."</p>
<p>— Hesketh Pearson</p>
在页面内使用引用的时候，通常会希望引用的外观与其他文字不同，最好能提示读者这段内容来自其他地方，同时（使用适当方法）与一般内容的阅读顺序分离。
方法A的标记方法与页面上的其他段落并没有不同，因此我们没有办法为它设定不同的样式，内容里的双引号就变成了引用内容的唯一提示了。
顺便提一下，在这个方法与之后的两个例子中 — 是长破折号（也就是“—”）的HTML字码，这里使用了10进制表示方法。这是支持所有浏览器最可靠的方法。或者，你也可以使用 —
方法B:以class处理?
<div class="quotation">
<p>Misquotations are the only quotations that are never
misquoted.</p>
<p>— Hesketh Pearson </p>
</div>
由于在包围引用内容的<div>标签里加了class="quotation",因此我们能够为它指定独特的css样式,但是HTML拥有专门解决这个问题的完美标签,因此建立这个特别分类似乎有点多余,我们马上就会看到这个完美的HTML标签.
在我们开始使用加上类的<div>之后,如果我们想让整个网站的样式保持一致,在标记各处引用的时候都会被限制在这个方法中,我们必须背下这个标签引用的特别的语法以便未来使用.如果我们管理的是以<div>与分类属性标记各种结构元素的大型网站,那就十分头疼了.因为事情很快就会变得十分散乱,而你将会需要一份记录所有自定分类的名称、用途的表格了。
使用不支持或者关闭css的浏览器访问这个方法标记的引用时也会发生问题。由于<div>只是一般容器,因此里面的内容没有任何预设样式.对使用旧版本浏览器,文字模式浏览器,屏幕阅读器的人来说,看到没有css的引用,和页面里其他内容完全一样.
方法C:<blockquote>最棒
<blockquote>
<p>Misquotations are the only quotations that are never
misquoted.</p>
<p>— Hesketh Pearson </p>
</blockquote>
W3C建议使用<blockquote>标记长引用(区块级内容),这个标签正是为了处理我们正在讨论的状况设计的,借着使用这个标签,我们能为内容加上结构意义,同时能提供独特的标记以便为可视化浏览器设定样式.
没有加上任何样式的话,<blockquote>标签的内容会缩进显示,这是最基本的视觉提示,足以将引用内容和一般文字区别开.然而,这种预设样式却引来了一种恶劣的习惯,我们稍后就会讨论.
用起子钉钉子
或许因为<blockquote>的内容看起来就像内缩过的段落,或者是从前需要缩进某个区块,某段文字的时候,你就会使用<blockquote>搞定.
不幸的,这是个非常糟糕的习惯,补救方法之一,是改用适当的元素加上css的padding-left或margin-left属性,以往<blockquote>常被这样滥用来设定显示效果,而不是用来标记内容结构.
由于有这种坏习惯,因此W3C建议将描述引用符号的责任交给样式表,不希望浏览器主动显示,在本章的"技巧延伸"中,我们会看到如何巧妙的加上漂亮的引用符号.
出处：蓝色理想
责任编辑：bluehearts
上一页 下一页 标记语言——引用 [2]
◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。
|
第 1 页 标记语言——引用 [1]
第 2 页 
