HTML5基础——文字常用标签（下）
2016-12-27 本文已影响122人
微学派
一、微文概览
- 粗体、斜体、下划线、删除线
- 上标与下标
二、详细介绍
-
1. 粗体、斜体、下划线、删除线
我们在浏览网页的时候，经常会看到一些特殊效果的文字，比如粗体、斜体、下划线、删除线等，下面我将给大家介绍这些效果。
1.1 粗体
语法：
<strong>粗体字</strong>
案例代码：
<html>
<head>
<title>文字的粗体</title>
</head>
<body>
<strong>粗体字</strong>
</body>
</html>
运行效果：
粗体字.png
1.2 斜体
语法：
<em>斜体字</em>
案例代码：
<html>
<head>
<title>文字的斜体</title>
</head>
<body>
<em>斜体字</em>
</body>
</html>
运行效果：
斜体.png
1.3 下划线
语法：
<u>下划线</u>
案例代码：
<html>
<head>
<title>文字的下划线</title>
</head>
<body>
<u>下划线</u>
</body>
</html>
运行效果：
下划线.png
1.4 删除线
语法：
<strike>删除线</strike>或<s>删除线</s>
案例代码：
<html>
<head>
<title>文字的删除线</title>
</head>
<body>
<strike>文字的删除线</strike><br/>
<s>文字的删除线</s>
</body>
</html>
运行效果：
删除线.png
-
2. 上标与下标
我们在浏览网页时，有时会看到数字的平方m²，m³，还有在上化学课时，经常会用到下标，比如CO2，其中2在O的下方，那么这种效果的文字该如何表示呢？
语法：
<sup>上标</sup>
<sub>下标</sub>
案例代码：
<html>
<head>
<title>文字的上下标</title>
</head>
<body>
m<sup>2</sup><br/>
CO<sub>2</sub>
</body>
</html>
运行效果：
文字的上标与下标.png
