文本标记
p是最常用的文本标记之一,要在网页中表示段落就需要用p标签。
small和strong
small表示细则一类旁注,通常包括免责声明、注意事项、法律版本、版权信息等。small通常是行内文本中的一小块,而不是包含多个段落或其他元素的大块文本。
1
2
3
4
5
6
7
| <p>Order now to receive free shipping. <small>(Some restrictions may apply.)</small></p>
<p>...</p>
<footer>
<p><small>© 2013 The Super Store. All Rights Reserved.</small></p>
</footer>
|
strong表示内容的重要性,而em表示内容的着重点。根据内容需要,这两个元素可以单独使用,也可以一起使用。
1
2
| <p><strong>Warning: Do not approach the zombies <em>under any circumstances</em></strong>. They may <em>look</em>
friendly, but that's just because they want to eat your arm.</p>
|
浏览器通常将strong文本以粗体显示,而将em文本以斜体显示,如果em是strong的子元素,将同时显示粗体和斜体。
注意:不用使用b元素代替strong,也不要使用i元素代替em。尽管他们在浏览器中显示的样式是一样的,但是含义却不一样。可以在strong中嵌套strong,em中嵌套em,来说明更加重要。
创建图
HTML5中引入了figure和figcaption来表示页面上的图。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| <article>
<h1>2013 Revenue by Industry</h1>
<p>. . . [report content] . . .</p>
<figure>
<figcaption><b>Figure 3:</b> Breakdown of Revenue by Industry</figcaption>
<img src="img/chart-revenue.png" width="180" height="143" alt="Revenue chart: Clothing 42%, Toys 36%, Food 22%" />
</figure>
<p>As Figure 3 illustrates, . . . </p>
<p>. . . [more report content] . . .</p>
</article>
|
这个figure只有一个图表,不过放置多个图像或其他类型的内容(如数据表格,视频等)也是允许的。figcaption元素并不是必须的,但如果包含他就必须是figure的第一个元素或者最后一个元素。
指明引用或参考
使用cite元素可以对内容的引用或参考进行指明,例如、戏剧、脚本或图书的标题,歌曲、电影、照片或雕塑的名称,演唱会、音乐会,报纸、法律文件等。
引述文本
blockqute元素表示单独存在的引述。
指定时间
我们可以使用time元素标记时间、日期或时间段。
1
| <time>2018-10-21</time>
|
图像
在img标签内,在src属性和值的后面添加alt=““来为图像添加描述文本,当图片显示失败的时候就会显示这段文本。
可以使用width=“x” 和height=“y"来设置图片显的宽高。
关于文本标签还有很多,可以参考w3c school的详细解释。更多HTML5和CSS3知识请参考《HTML5与CSS3基础教程》点击下载