HTML5 教程学习 - mark元素标签
HTML5带来的<mark>元素标签除了可以使全世界叫做Mark的人开心之外,主要的功能就是在页面中高亮显示那些需要在视觉上向用户突出其重要性的文字。
实例1:在搜索结果中的应用
<mark>标签的一个比较典型的应用就是在搜索结果中向用户高亮显示搜索关键词;现今很多搜索引擎已经使用了这种辅助提示功能,只是实现的方法不同。我们来看看示例代码:
<h1>716,000,000 search results for the query "<mark>HTML 5</mark>"</h1>
<section id="search-results">
<article>
<h2><a href="http://en.wikipedia.org/wiki/HTML_5"><mark>HTML 5</mark> - Wikipedia, the free encyclopedia</a></h2>
<p><mark>HTML 5</mark> is the next major revision of <mark>HTML</mark> ("hypertext markup language")...</p>
</article>
<article>
<h2><a href="http://dev.w3.org/html5/spec/Overview.html"><mark>HTML 5</mark></a></h2>
<p>A vocabulary and associated APIs for <mark>HTML</mark> and XHTML. Editor's Draft 16 August 2009...</p>
</article>
<article>
<h2><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/"><mark>HTML 5</mark></a></h2>
<p>Multiple-page version: http://whatwg.org/<mark>html5</mark>; One-page version: http://www.whatwg.org/specs...</p>
</article>
<article>
<h2><a href="http://html5gallery.com/"><mark>HTML5</mark> Gallery</a></h2>
<p>A showcase of sites using <mark>html5</mark> markup, with twin primary aims to help web designers...</p>
</article>
</section>
在演示中我们可以看到所有的搜索关键词都被高亮显示了。
实例2:引用
一些文字片段或演讲片段等,其重要性在最初被发布和记录的时候未必会意识到,也就不会被做任何“突出重要性”的标记;当我们在引用这些文字记录时,如果觉得有必要,可以使用<mark>标签来突出显示我们认为重要的部分;例如:
<p>i once said:</p>
<blockquote>
<p>UT won't last, <mark>it will fail</mark> at FPS as nothing will topple Quake.</p>
</blockquote>
<p>Of course, we now know i was wrong. UT has not failed, it excelled in FPS.</p>
我在这里篡改了原文关于Google与Yahoo的内容,将自己从前的错误言论引用了过来并标注出重点错误,同时在下面的段落重中进行了纠正。
与<strong>、<em>的区别
相比于我们习惯使用的这两个表示“突出重要性”的标签,<mark>主要用来在视觉上向用户呈现那些需要突出的文字;当然,一直以来我们也时常使用<strong>和<em>来加强视觉上的重要性,但毕竟,在很多情况下,还是新的<mark>标签更加恰当。
译者:Viiiix7210
原文参考:html5doctor.com,W3C HTML5 规范
| < Prev | Next > |
|---|
