文本标签
-
<em>和<strong>
em标签用于表示一段内容中的着重点。
strong标签用于表示一个内容的重要性。
这两个标签可以单独使用，也可以一起使用。
通常em显示为斜体，而strong显示为粗体。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>
<strong>警告：任何情况下不要接近僵尸。</strong>
他们只是 <em>看起来</em> 很友好，实际上他们是为了吃你的胳膊！
</p>
</body>
</html>
-
<i>和<b>
i标签会使文字变成斜体。
b标签会使文字变成粗体。
这两个标签和em和strong类似，但是这两 个标签没有语义。
所以根据html5标准，当我们只想设置文本 特殊显示，而不需要强调内容时就可以使 用i和b标签。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<i>斜体</i>
<b>粗体</b>
</body>
</html>
-
<small>
small标签表示细则一类的旁注，通常包括 免责声明、注意事项、法律限制、版权信 息等。
浏览器在显示small标签时会显示一个比父 元素小的字号。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>
<small>
©2018北财. 保留所有权利.
</small>
</p>
</body>
</html>
-
<cite>
使用cite标签可以指明对某内容的引用或参 考。例如，戏剧、文章或图书的标题，歌 曲、电影、照片或雕塑的名称等。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>
<cite>《七龙珠》</cite>
讲的是召唤神龙的故事。
</p>
</body>
</html>
-
<blockquote>和<q>
blockquote和q表示标记引用的文本。
blockquote用于长引用，q用于短引用。
在两个标签中还可以使用cite属性来表示引 用的地址。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>
孟子曾经说过：
<blockquote>天将降大任于是人也...</blockquote>
他说的真对啊！
</p>
<p>孔子曾经说过：<q>学而时习之不亦说乎</q></p>
</body>
</html>
-
《sup>和<sub》
sup和sub用于定义上标和下标。
上标主要用于表示类似于103中的3。
下标则用于表示类似余H2O中的2。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>
20<sup>2</sup>
</p>
<p>
2<sub>2</sub>05
</p>
</body>
</html>
-
<ins>和<del>
ins表示插入的内容，显示时通常会加上下 划线。
del表示删除的内容，显示时通常会加上删 除线。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<ins>123</ins>
<del>123</del>
</body>
</html>
-
<code>和<pre>
如果你的内容包含代码示例或文件名，就 可以使用code元素。
pre元素表示的是预格式化文本，可以使用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<pre>
<code>
print("hahah")
</code>
</pre>
</body>
</html>
-
<ol>和<li>
使用ol和li来创建一个有序列表。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ol>
</body>
</html>
-
<ul>和<li>
使用ul和li来创建一个无序列表。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>
</body>
</html>
-
<ul>和<li>
使用dl、dd、dt来创建一个定义列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<dl>
<dt>定义项1</dt>
<dd>定义描述1</dd>
<dt>定义项2</dt>
<dd>定义描述2</dd>
<dt>定义项3</dt>
<dd>定义描述3</dd>
</dl>
</body>
</html>
网友评论