如何使用 HTML5 在文件中強調文字?


可以使用各種 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>

結論

在 HTML5 中,可以使用多種技術來強調文字。要使用的方法取決於您的工作特定要求和 UI UX 需求的型別。透過使用這些 HTML5 功能,您的網站可以脫穎而出,並確保讀者關注您網站最重要的細節。

更新於: 2023-08-09

148 次瀏覽

開啟您的 職業生涯

透過完成課程獲得認證

立即開始
廣告

© . All rights reserved.