在 HTML 中建立小文字
如果我們想在 HTML 文件中設定較小的字型大小,可以使用 <small> 標籤。此標籤用於將字型大小減小一個級別,即從中等大小減小到小尺寸,或從特大尺寸減小到大型尺寸。有兩種方法可以使用此 <small> 標籤在 HTML 中
巢狀形式
非巢狀形式
語法
以下是 HTML 中小字型標籤的使用方法 -
<small>text… </small>
它具有開始和結束標籤。它支援全域性屬性和事件屬性。
示例
以下示例演示了 small 標籤的使用 -
<!DOCTYPE html> <html> <head> <title>HTML small Tag</title> </head> <body> <h2>Tutorialspoint</h2> <p><small> Simply Easy Learning</small></p> </body> </html>
巢狀形式
如果我們在巢狀形式中使用 small 標籤,它會根據父級字型大小更改其間存在的字型大小。例如,如果我們增加父文字的字型大小,small 標籤的字型大小也會自動增加。
示例
以下示例演示瞭如何新增 HTML 的標題、主體和其他結構。
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 15px;">HTML means <small>Hyper Text Markup Language</small></p> </body> </html>
示例
在以下示例中,我們嘗試增加 <small> 標籤父元素的字型大小。
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 40px;">HTML means <small>Hyper Text Markup Language</small></p> </body> </html>
注意 - 巢狀小文字的字型大小與父元素文字的字型大小之間的比率相同。
什麼是非巢狀形式?
非巢狀形式意味著,我們可以將 small 標籤作為 HTML 中的單獨元素使用,這樣父元素的字型大小就不會影響 small 標籤文字。
示例
以下是非巢狀 small 標籤的示例 -
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 15px;">HTML means </p> <small>Hyper Text Markup Language</small> </body> </html>
示例
現在考慮另一個示例,嘗試更改段落的字型大小,並檢查 <small> 標籤的字型大小發生了什麼變化。
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 30px;">HTML means </p> <small>Hyper Text Markup Language</small> </body> </html>
對 <small> 標籤的 CSS 設定
現在,我們嘗試應用 CSS 屬性,透過使用 small 標籤來設定文字的字型大小。
<!DOCTYPE html>
<html>
<head>
<style>
span.small {
font-size: smaller;
color: blue;
}
</style>
</head>
<body>
<h2>Demonstrating smaller text by applying CSS</h2>
<p>HTML Means,</p>
<p>
<span class="small">Hyper Text Markup Language.</span>
</p>
</body>
</html>
廣告
資料結構
網路
RDBMS
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP