如何使用 HTML5 强调文档中的文本?

htmlhtml5front end technology更新于 2024/11/24 19:56:17

可以使用各种 HTML5 功能强调文档中的文本，这有助于突出显示关键信息，并使读者更容易立即识别重要元素。强调文本的常用技巧是将文本加粗。

HTML 中使用不同的标签，例如 - <b>、<i>、<u> 等，用于强调文本、上标文本、添加化学配方和数学公式。

语法

<p> <b>bold</b> <i>italic</i> <u>underline</u> </p>

示例

在本例中，我们将研究在 HTML5 文档中强调文本的不同技巧，例如，&minus b> 标签用于使文本加粗，i> 标签用于使文本变为斜体，u> 标签用于为文本添加下划线，mark> 标签用于突出显示文本，small> 标签用于使文本变小，strong> 标签用于强烈强调文本，em> 标签用于强调文本，sup> 标签用于上标，sub> 标签用于显示文本大小。标签用于下标。

算法

步骤 1:确定要突出显示的文本。

步骤 2:根据所需的强调类型(粗体、斜体、下划线等)选择合适的 HTML 元素。

步骤 3:使用您选择的 HTML 元素包裹识别出的文本。

步骤 4:保存并查看修改后的 HTML 文档。

示例

<!DOCTYPE html>
<html>
<head>
	<title>Emphasize Text on Webpage</title>
</head>
<body>
	<h1>Text Emphasized With HTML 5</h1>
<p>
<!-- underline the text with u tag -->
Here we have <u>underlined</u> text.
</p>

<p>
<!-- b tag to bold text –->
		Lets <b>bold</b> the text.
</p>
<p>
<!-- highlight tag using mark tag -->
		This is how <mark>highlighted</mark> text look.
</p>
<p>
<!-- i tag to make text style italic -->
		Now, Let's try <i>italic</i> text.
</p>
<p>
<!-- strongly bold the text by using strong tag -->
		You can also <strong>strongly emphasized</strong> text.
</p>
<p>

<!-- em tag to emphasize text less than stronger -->
		Many websites <em>emphasize</em> text in this way.
</p>
<p> We can compress text with <small>small</small> text feature.
</p>
<p>
<!-- script the text using sup tag -->
		You can use superscript: x<sup>2</sup> while doing Maths.</p> <p>
//script the tag using sub tag//
You can also do subscript: H<sub>2</sub>O while doing science and math work.
</p>
</body>
</html>