HTML 中的字型標籤是用來使網頁或 HTML 文件更具吸引力的最重要屬性之一。它具有更改所包含文字的大小、顏色和樣式的屬性。借助字體標籤,可以使網頁的大小、顏色和外觀採用相同的文字格式。此標籤主要作用於尺寸、面或類型和顏色等三個主要屬性。字體標籤作為 HTML 中的內嵌元素來變更 HTML 文件中區塊文字的某些功能。 內包含的文字標籤用於定義其中所包含的文字的樣式。
文法:
<font size =" " face =" " color=" ">
<body> <p> <font size="2" color="blue" face="Calibri"> </font> </p> </body>
此標籤也支援全域屬性和事件屬性。此外,它還支援一些其他屬性,如下所示:
Attribute Name | Detail Description |
Size | This attribute is used to define a specific size for text in between 1 to 7. |
Face or type | This attribute is used to define the font type for the included text. |
Color | This attribute is used to show enclosed text in a different color. |
Weight | This attribute defines the boldness of the text of the font tag. |
範例#1
定義字型標籤及其屬性值:
<!DOCTYPE html> <html> <head> <title>Font Tag in HTML</title> </head> <body> <h2>Example of Font Tag in HTML </h2> <p>General text without any Font tag attribute value</p> <p> <font color="orange">Text having normal font size and font face . Only changing font color </font> </p> <p> <font face="cursive">Text having different font face.</font> </p> <p> <font size="3">Text with Increased font size having default font type. </font> </p> </body> </html>代碼:
輸出:
範例#2
定義字體標籤,其屬性值透過CSS定義:
<!DOCTYPE html> <html> <head> <title>Font Tag in HTML</title> </head> <body> <h2>Example of Font Tag in HTML using CSS </h2> <p>Someone’s sitting in the shade today because someone plated a tree a long time ago. </p> <p style="color : lightgreen;"> Someone’s sitting in the shade today because someone plated a tree a long time ago. </p> <p style="font-family : Book Antiqua; color: blue; " > Someone’s sitting in the shade today because someone plated a tree a long time ago. </p> <p style="font size:3px;"> Someone’s sitting in the shade today because someone plated a tree a long time ago. </p> </body> </html>代碼:
輸出:
範例 #3
在此範例中,我們使用具有屬性值 size 的 Font 標籤,它將定義從最小尺寸到最大尺寸的文本,如下所示:
<!DOCTYPE html> <html> <head> <title>HTML font tag</title> </head> <body> <font size = "1">People may doubt what you say, but they will believe what you do.</font><br /> <br/> <font size = "2">People may doubt what you say, but they will believe what you do.</font><br /> <br/> <font size = "3">People may doubt what you say, but they will believe what you do.</font><br /> <br/> <font size = "4">People may doubt what you say, but they will believe what you do.</font><br /> <br/> <font size = "5">People may doubt what you say, but they will believe what you do.</font><br /> <br/> <font size = "6">People may doubt what you say, but they will believe what you do.</font><br/><br/> <font size = "7">People may doubt what you say, but they will believe what you do.</font> </body> </html>HTML 程式碼:
輸出:
範例#4
<!DOCTYPE html> <html> <head> <title>HTML tag with Font Type attribute</title> </head> <body> <font face = "Comic sans MS"> Correct one fault at a time. Concentrate on the one fault you want to overcome.</font><br/> <font face = "Bernard MT Condensed" color="Red" >Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/> <font face = "Algerian">Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/> <font face = "Book Antiqua" size="5">Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/> <font face = "Aharoni"> Correct one fault at a time. Concentrate on the one fault you want to overcome.</font><br/> <font face = "AR BERKLEY" >Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/> </body> </html>HTML 程式碼:
輸出:
範例#5
<!DOCTYPE html> <html> <head> <title>HTML Font tag-Color </title> </head> <body> <font color = "#cc0066"><b>It is terrible thing to see and have no vision</b></font><br> <font color = "#66ff33"><b>Today's preparation </b></font> <br> <font color = "#0000cc"><strong>Success depends on your backbone not your wishbone.</strong></font><br /> <font color = "#cc3300"><b>Patience makes lighter what sorrow may not heal</b></font> <br> <font color = "#666600"><b>Hold fast to dreams, for if dreams die, life is broken winged bird that cannot fly </b></font> <br> </body> </html>HTML 程式碼:
輸出:
以上是HTML 中的字型標籤的詳細內容。更多資訊請關注PHP中文網其他相關文章!