HTML 字體樣式-html教學-PHP中文網

HTML 字體樣式

WBOY

發布： 2024-09-04 16:14:25

原創

785 人瀏覽過

以下文章「HTML 字體樣式」概述了 HTML 中最常用的字體樣式。 HTML，俗稱超文本標記語言，是創建 Web 應用程式和網站所必需的最基本、最關鍵的語言或腳本之一。這就像網頁應用程式開發的支柱，因為所有標籤和其他功能構成了它的底層組件。

所有的前端開發也是基於HTML腳本。這只能用於提供標記標籤，為了增強這些標籤的外觀和感覺，我們有另一個非常流行的庫，CSS，它代表級聯樣式表。這可以用來實現 HTML 所需的各種樣式。字體和樣式構成了網站的主要部分，在本文中，我們將為您提供大多數 HTML 字體樣式的清單。

HTML 字型樣式

除了提高內容可讀性之外，字體在使網站更加用戶友好、吸引更多流量方面發揮著重要作用。字體顏色和字體也取決於電腦和使用其的瀏覽器，並且 HTML 也取決於電腦和瀏覽器。標籤也用於在網站上的文字中添加樣式、顏色、大小。

;標籤用於設定您網站上或

內出現的所有文字。元素具有相同的尺寸、顏色和外觀。字體標籤由三個屬性組成：字體顏色和大小，這又構成了網站內不同字體樣式的關鍵組成部分。

;標籤是最常用且最重要的標籤之一，可用於為您的網頁建立良好的外觀和感覺。開啟的後面的文字是標籤將保持相同的方式，除非並且直到被關閉。標籤。

讓我們來看看一些基本的 HTML 字體樣式：

有一些與 HTML 字體樣式相關的基本功能和特性，它們是：

1.設定字體大小

內容字體大小可以透過使用 size 屬性來設定。可接受的範圍值從 1（最小數）到 7（最大數）。任何字體類型的預設大小都是 3。

範例，

<!DOCTYPE html>
<html>
<head>
<title>Setting Basic Font Size</title>
</head>
<body>
<font size = "1">Font size = "1"</font><br />
<font size = "2">Font size = "2"</font><br />
<font size = "3">Font size = "3"</font><br />
<font size = "4">Font size = "4"</font><br />
<font size = "5">Font size = "5"</font><br />
<font size = "6">Font size = "6"</font><br />
<font size = "7">Font size = "7"</font>
</body>
</html>

登入後複製

2.相對字體大小

相對字體大小用於確定和指定比實際存在的當前字體大小大多少個尺寸和小多少個尺寸。可以這樣指定：

<font size = "+f"> or by writing <font size = "−f">

登入後複製

範例，

<!DOCTYPE html>
<html>
<head>
<title>Relative Font Size</title>
</head>
<body>
<font size = "-1">Font size = "-1"</font><br />
<font size = "+1">Font size = "+1"</font><br />
<font size = "+2">Font size = "+2"</font><br />
<font size = "+3">Font size = "+3"</font><br />
<font size = "+4">Font size = "+4"</font>
</body>
</html>

登入後複製

3.設定字體

字體大小和相對字體大小設定之後的另一類是字體設定。這構成了上面列出的屬性的關鍵部分。這可以透過使用face屬性來設置，但應該始終記住，如果指定使用此字體值的使用者沒有在其係統中安裝此字體，他們將無法看到它。相反，只有適用於該特定使用者電腦的預設字體才會可見。

範例，

<!DOCTYPE html>
<html>
<head>
<title>Font Face</title>
</head>
<body>
<font face = "Times New Roman" size = "5">Times New Roman</font><br />
<font face = "Verdana" size = "5">Verdana</font><br />
<font face = "Comic sans MS" size =" 5">Comic Sans MS</font><br />
<font face = "WildWest" size = "5">WildWest</font><br /&gt
<font face = "Bedrock" size = "5">Bedrock</font><br />
</body>
</html>

登入後複製

4.指定替代字體

僅當使用者在其係統上安裝了特定字體時，這才用於指定各種字體；否則，將顯示預設安裝的字體。透過列出字體名稱，可以提及多個，特別是兩個或兩個以上的字體替代方案，字體名稱特別用逗號分隔。
當網頁載入時，瀏覽器將負責顯示第一個產生的字體。如果系統中沒有安裝提供的字體，則預設字體Times New Roman將會成功顯示。

範例，

<font face = "arial,helvetica">
<font face = "Lucida Calligraphy,Comic Sans MS,Lucida Console">

登入後複製

5.設定字體顏色

這是構成 HTML 字型和樣式清單的關鍵部分和元件的另一個屬性。在這種字體中，顏色是透過使用任何顏色屬性來設定的；可以透過使用指定顏色的十六進位代碼和顏色名稱來取得所需的顏色。

範例，

<!DOCTYPE html>
<html>
<head>
<title>Setting Font Color</title>
</head>
<body>
<font color = "#FF00FF">This text is in pink</font><br />
<font color = "red">This text is red</font>
</body>
</html>
<basefont>

登入後複製

6. Element

This element is specific to HTML language and is supposed to provide the webpage with a default font size, typeface, and color for all the parts and components of the documents which are not contained inside the tag.

The tag could be easily used to override the settings.

This tag also makes use of color, face and size attributes which will relatively support all the font settings by providing the size of a value of +1 for one size greater or -2 for two sizes smaller.

Example,

<!DOCTYPE html>
<html>
<head>
<title>Setting Basefont Color</title>
</head>
<body>
<basefont face = "arial, verdana, sans-serif" size = "2" color = "#ff0000">
<p>This is the page's default font.</p>
<h2>Example of the &lt;basefont&gt; Element</h2>
</body>
</html>

登入後複製

Conclusion

HTML font and styles are among the most critical components and features that cannot be overlooked and can give a very good shape and design to your website. When we talk about the latest javascript libraries available in the market, they contain all these and several other font and styles. For the basic HTML, this still needs to be done manually. I hope you liked our article. Stay tuned to our blog for more articles like these.

以上是HTML 字體樣式的詳細內容。更多資訊請關注PHP中文網其他相關文章！