本文概述
- 1)粗体
- 2)斜体文字
- 3)HTML标记格式
- 4)带下划线的文字
- 5)罢工文字
- 6)等宽字体
- 7)上标文字
- 8)下标文字
- 9)删除文字
- 10)插入文字
- 11)较大的文字
- 12)较小的文字
在HTML中, 格式标记分为两类:
- 物理标签:这些标签用于为文本提供视觉外观。
- 逻辑标签:这些标签用于在文本中添加一些逻辑或语义值。
元素名称 | 描述 |
---|---|
< b> | 这是一个物理标记, 用于加粗在它们之间写入的文本。 |
< strong> | 这是一个逻辑标记, 它告诉浏览器文本很重要。 |
< i> | 这是一个物理标签, 用于使文本变为斜体。 |
< em> | 这是一个逻辑标签, 用于以斜体显示内容。 |
< mark> | 此标签用于突出显示文本。 |
< u> | 该标签用于在其间写的文本下划线。 |
< tt> | 该标签用于在电传打字机中显示文本。 (HTML5不支持) |
< strike> | 此标记用于在文本的一部分上绘制删除线。 (HTML5不支持) |
< sup> | 它显示的内容略高于法线。 |
< sub> | 它显示的内容略低于法线。 |
< del> | 该标签用于显示已删除的内容。 |
< ins> | 该标签显示添加的内容 |
< big> | 该标签用于将字体大小增加一个常规单位。 |
< small> | 此标记用于将字体大小从基本字体大小减少一个单位。 |
HTML < b> 元素是一个物理标记, 以粗体显示文本, 没有任何逻辑上的重要性。如果你在< b> … … … … < / b> 元素内编写任何内容, 则会以粗体显示。
请参阅以下示例:
<
p>
<
b>
Write Your First Paragraph in bold text.<
/b>
<
/p>
立即测试
输出:
Write Your First Paragraph in bold text.
HTML < strong> 标记是一个逻辑标记, 它以粗体显示内容, 并通知浏览器其逻辑重要性。如果你在< strong> ???????之间写任何东西。 < / strong> , 显示重要的文本。
请参阅以下示例:
<
p>
<
strong>
This is an important content<
/strong>
, and this is normal content<
/p>
立即测试
输出:
This is an important content, and this is normal content
例
<
!DOCTYPE html>
<
html>
<
head>
<
title>
formatting elements<
/title>
<
/head>
<
body>
<
h1>
Explanation of formatting element<
/h1>
<
p>
<
strong>
This is an important content<
/strong>
, and this is normal content<
/p>
<
/body>
<
/html>
立即测试
2)斜体文字HTML < i> 和< em> 格式元素
HTML < i> 元素是物理元素, 它以斜体字体显示了包含的内容, 没有任何附加的重要性。如果你在< i> … … .. < / i> 元素内编写任何内容, 则以斜体字母显示。
请参阅以下示例:
<
p>
<
i>
Write Your First Paragraph in italic text.<
/i>
<
/p>
立即测试
输出:
Write Your First Paragraph in italic text.
HTML < em> 标记是一个逻辑元素, 它将以斜体显??示附带的内容, 并增加了语义的重要性。
请参阅以下示例:
<
p>
<
em>
This is an important content<
/em>
, which displayed in italic font.<
/p>
立即测试
输出:
This is an important content, which displayed in italic font.
<
!DOCTYPE html>
<
html>
<
head>
<
title>
formatting elements<
/title>
<
/head>
<
body>
<
h1>
Explanation of italic formatting element<
/h1>
<
p>
<
em>
This is an important content<
/em>
, which displayed in italic font.<
/p>
<
/body>
<
/html>
立即测试
3)HTML标记格式如果要标记或突出显示文本, 则应将内容写在< mark> … … … < / mark> 中。
请参阅以下示例:
<
h2>
I want to put a <
mark>
Mark<
/mark>
on your face<
/h2>
立即测试
输出:
I want to put a Mark on your face
4)带下划线的文字如果你在< u> … … … < / u> 元素内写了任何内容, 则会在带下划线的文本中显示。
请参阅以下示例:
<
p>
<
u>
Write Your First Paragraph in underlined text.<
/u>
<
/p>
立即测试
输出:
Write Your First Paragraph in underlined text.
5)罢工文字< strike> … … … … … … … .. < / strike> 元素中写入的所有内容均带有删除线。这是一条跨越声明的细线。
请参阅以下示例:
<
p>
<
strike>
Write Your First Paragraph with strikethrough<
/strike>
.<
/p>
立即测试
输出:
Write Your First Paragraph with strikethrough.
6)等宽字体如果希望每个字母具有相同的宽度, 则应将内容写在< tt> … … … … . < / tt> 元素内。
注意:我们知道大多数字体都称为可变宽度字体, 因为不同的字母具有不同的宽度。 (例如:“ w”比“ i”宽)。等宽字体在每个字母之间提供相似的空间。
请参阅以下示例:
<
p>
Hello <
tt>
Write Your First Paragraph in monospaced font.<
/tt>
<
/p>
立即测试
输出:
HelloWrite Your First Paragraph in monospaced font.
7)上标文字如果将内容放在< sup> … … … … .. < / sup> 元素中, 则会显示上标;表示它显示为比其他字符高半个字符。
请参阅以下示例:
<
p>
Hello <
sup>
Write Your First Paragraph in superscript.<
/sup>
<
/p>
立即测试
输出:
HelloWrite Your First Paragraph in superscript.
8)下标文字如果将内容放在< sub> … … … … .. < / sub> 元素中, 则显示在下标;表示它显示为比其他字符低半个字符的高度。
请参阅以下示例:
<
p>
Hello <
sub>
Write Your First Paragraph in subscript.<
/sub>
<
/p>
立即测试
输出:
HelloWrite Your First Paragraph in subscript.
9)删除文字放在< del> … … … . < / del> 中的所有内容都将显示为已删除的文本。
【HTML格式】请参阅以下示例:
<
p>
Hello <
del>
Delete your first paragraph.<
/del>
<
/p>
立即测试
输出:
Hello
10)插入文字放在< ins> … … … . < / ins> 中的所有内容均显示为插入的文本。
请参阅以下示例:
<
p>
<
del>
Delete your first paragraph.<
/del>
<
ins>
Write another paragraph.<
/ins>
<
/p>
立即测试
输出:
Delete your first paragraph.Write another paragraph.
11)较大的文字如果要使字体大小大于文本的其余部分, 则将内容放在< big> … … … < / big> 之内。它增加一种字体大小, 比上一种字体大。
请参阅以下示例:
<
p>
Hello <
big>
Write the paragraph in larger font.<
/big>
<
/p>
立即测试
输出:
HelloWrite the paragraph in larger font.
12)较小的文字如果要使字体大小小于文本的其余部分, 则将内容放在< small> … … … < / small> 标记内。它比前一种缩小了一种字体大小。
请参阅以下示例:
<
p>
Hello <
small>
Write the paragraph in smaller font.<
/small>
<
/p>
立即测试
输出:
HelloWrite the paragraph in smaller font.
推荐阅读
- HTML frame标记(HTML5不支持)
- HTML表单输入类型
- HTML表单属性
- HTML表单详解
- HTML input标签
- HTML图片
- HTML iframe用法
- HTML ID属性
- HTML html标记