《元气森林》专题

使用 map元素，可以定义一个图像映射。图像映射是指把一幅图像划分为多个区域（即热点区域），每个热点区域对应一个超级链接，当用户点击热点区域，会自动跳转到预先设定好的链接地址。 创建一个图像映射，需要 img、map、area 三种标签配合完成： 首先，使用 img 元素定义一幅图像，并通过 src 属性定义图像的URL，通过 usemap 属性定义要选择的图像映射名称，以建立图像与图像映射之间的

链接是万维网的命脉，如果没有链接，每个页面都只能孤立地存在，同其他页面完全分开。通过链接，可以建立同其他网页或网站之间的连接，可以不夸张的讲，没有链接，就没有万维网。 在网页中，通过链接来指向一个目标，这个目标可以是网页、网页中的具体位置、图像、邮件地址、文件、FTP地址等，甚至是一个应用程序。 链接可以是一个字、一个词、一组词、一幅图像，点击这些内容会跳转到新的文档或当前文档的某个具体位置。一般

span元素也是一个没有语义的元素，类似于 div 元素。不过，span 是行内元素，它只能包围字词或短语，而 div 元素适合包含块级内容。 如果想为一小块内容定义 class、id、dir、lang 等属性，或定义特殊的显示风格，或定义Javascript行为，而又没有相应的HTML语义元素时，就可以使用 span元素。 如，以下段落中，通过三个 span元素，定义了三小块内容，并为它们分别应

wbr元素表示一个可以换行的机会，即表示必要时可以在此处换行，至于是否换行，则由浏览器根据窗口或父元素的宽度情况自主决定。当宽度足够时，即没必要换号时，不进行换行，当宽度不够时，主动在此处换行。如： <p>To learn AJAX, you must be familiar with the XMLHttp<wbr>Request.</p> 正常情况下，当宽度不足时，会在行末将整个单词放到下一

默认情况下，浏览器会根据包含内容的块或窗口的宽度，让文本内容自动换行。但有时候，可能希望手动强制内容换行。这时，就可以使用 br元素。br元素是一个单标签元素，需要使用“/”来正确地关闭，格式为 <br />。 对于一个段落，如果没有 br元素，整个段落都会在同一行显示，而每个 br元素都会强制接下来的内容在新的一行显示。如： <p>剑<br />一把剑<br />一把锋利的剑</p> 使用 b

kbd元素用于指示用户输入的文本，经常用于计算机相关的文档和手册中，用来表示的是键盘输入的文本，如Ctrl，但也可以用来定义其他输入，如声音命令。 如果在 kbd元素中直接包含文本，就表示键盘输入，即指示键盘按键。如，以下段落中的Shift、F3 就表示键盘按键： <p>To make George eat an apple, press <kbd>Shift</kbd> + <kbd>F3</

samp元素用于指示程序或系统的示例输出，各种程序的示例输出，都可以把它放在 <samp></samp> 标签中。 如果要同时表示输入和输出，可以将 kbd元素嵌在 samp元素中，kbd 就表示系统回显的输入，samp 就表示系统的输出。 将 kbd元素嵌在 samp元素中的好处是，可以方便为输入和输出定义不同的显示风格。当然，为了更精确的控制显示风格，可以配合使用 span 等元素。 如，在以

var元素用来定义计算机程序的源代码中的变量，它可以是数学表达式或程序上下文中一个真正变量，或一个常量，或函数参数，或仅仅是内容中的占位符。如： <p>爱因斯坦质能方程：<var>E</var> = <var>m</var> <var>c</var>²</p> 默认情况下，浏览器将var元素中的文本显示为斜体。运行结果如图 2‑30 所示： 图2-30 var元素 由于变量

code元素用来定义计算机程序的源代码或其他机器可以阅读的文本，如计算机程序、或函数名、XML元素名、或文件名等。 由于浏览器会将网页中所有额外的回车和空格进行压缩，并根据窗口的大小自动换行。因此，人们常常使用 pre 元素类包裹 code元素，以便 code元素中的文本能够按预先定义好的格式原样显示。 有时候，希望通过脚本对源代码进行语法高亮显示，也可以使用 class属性来指定源代码所使用的编

time元素用于定义时间、日期、时间段，它代表24小时中的某个时刻或某个日期，在表示时刻时，还允许带时差。有多种格式来呈现时间信息。如： <time datetime="2016-8-23">2016年8月23日</time> <time datetime="2016-8-23">8月23日</time> <time datetime="2016-8-23">我的生日</time> <time

dfn元素用来定义术语，可以通过可选的 title属性来提供对术语的准确定义。如果提供定义，只需包含对术语的定义，不必包含其他内容。 定义术语时，dfn元素仅仅包含术语，而不必包含术语的定义。并且，只对首次出现的术语使用 dfn元素，后面再提到该术语时，则不再使用 dfn元素。但是，如果术语是缩写词，后面出现时，也可以使用 abbr 元素。如： <p>The <dfn><abbr title="

abbr元素用于标记缩写词或首字母缩写，如 HTML、HTTP等等。标记为缩写词之后，浏览器、拼写检查器、翻译系统、搜索引擎都能根据它来了解文本的性质。不必对每一个缩写词都使用 abbr，只需对那些生僻的、需要帮助读者了解含义的词使用。 一般会在 abbr元素中，通过可选的 title属性中，定义对缩写词的完整描述。如果要提供解释，则只需解释缩写词，不必包含其他解释。如： <abbr title

mark元素定义一个标记文本，其主要功能是在文本中高亮显示某个或某几个字符，旨在引起用户的特别注意。如： <p>I also have some <mark>kitten</mark>s … adopt a <mark>kitten</mark>.</p> 默认情况下，浏览器对 mark元素中的文本添加了黄色背景，来高亮显示这些文本。运行结果如图 2‑24 所示： 图2-24 mark元素 ma

cite元素创建一个引用标记，用来指明某内容的引用或参考源，如书籍或杂志或新闻报道等的标题，规范、报纸、法律文件，网络文章的URL等。如，以下代码定义了引用的文章的来源，包括URL： <h1>HTML5</h1> <p>万维网的核心语言、标准通用标记语言……的第五次重大修改。</p> <p>-- 引自<cite><a href="http://baike.baidu.com/">百度百科</a>

q元素用于定义简短的引用，如句子中的引用，引用的内容必须来自另一个引用源。如果引用源有一个地址的话，还可以通过 q元素的 cite 属性，来提供内容的引用源。如果 q元素中的文本与主要文本使用不同的语言，则要使用 lang属性来注明。如： <p>The W3C page <cite>About W3C</cite> says the W3C's mission is <q cite="http: