HTML 顏色
- 王林原創
- 2024-09-04 16:33:57567瀏覽
本文介紹如何使用 HTML 以簡單易行的方式在網站中使用顏色。顏色在創建網站的外觀和感覺方面發揮著重要作用。 HTML 中沒有單獨的標籤；相反，它使用樣式屬性或顏色屬性。準確地說，顏色是使用層疊樣式表 (CSS) 嵌入到 HTML 元素中的。顏色賦予網頁優雅的外觀。為網頁新增顏色包括設定背景顏色、表格、段落等
如何在 HTML 中設定背景顏色？
讓背景顏色變亮使網站看起來更漂亮、更大膽。它是透過使用顏色、十六進制顏色代碼來完成的。 RGB 和 RGBA 顏色值（Alpha 值 0 到 1）。
使用 Html body 元素內的 Style 屬性將十六進位顏色直接套用於 Html 程式碼。十六進制是數字和字母的組合。以下是網頁背景顏色的範例。
代碼：
<!DOCTYPE html> <title>My Sample</title> <html> <head> <title>HTML BG Color</title> </head> <body style="background-color:red;"> <h1> This page is a demo </h1> </body> </html>
程式碼片段：
要新增背景顏色，可以使用 bgcolor 屬性來顯示
body bgcolor=''>.它與除 HTML 5 之外的所有瀏覽器相容。代碼：
<h3 style="color: blue">Color Name</h3> <h3 style="color: #0000ff">Hexadecimal</h3> <h3 style="color: rgb (0,0,255)">RGB Value</h3>
如何為 HTML 中的文字套用顏色？
對 HTML 文字套用顏色非常簡單；我們可以透過三種方式添加/更改文字的顏色，即十六進位顏色、HSL 值和顏色名稱。以下是將顏色應用到對應網頁的三種不同技術。
1.顏色名稱
當應用程式直接使用這些顏色名稱時，使用英文顏色名稱非常簡單。指定顏色名稱是直接方法，W3C已經公佈了16種基本顏色（黑色、黃色、紅色、栗色、灰色、石灰、綠色、橄欖色、銀色、水色、藍色、海軍藍、白色、紫色、紫紅色、青色）
2.福勝利
色相飽和度和亮度顏色值。色調定義為 0 到 360 度，飽和度和亮度定義為 0 到 100 %。
3.十六進位顏色
為了得到精確的結果，應用六位十六進位數。詳細來說，前兩位表示紅色，後兩位表示綠色，另外兩位表示藍色值，前面有「#」。
以下範例解釋了向文件應用顏色的不同方法。
代碼：
<head>
<title>EDUCBA</title>
<style type="text/css">
h1{
color:#97cae0;
background-color: hsl(200, 50%, 20%);
color: hsl(200, 20%, 90%);
}
h4{
color:rgb(0, 255, 0);
background-color: hsl(130, 10%, 30%);
color: hsl(280, 20%, 80%);
}
li{
color:rgba(12, 88, 120, 1);
background-color: hsl(210, 36%, 50%);
color: hsl(145, 45%, 81%);
}
</style>
</head>
<body>
<h1>EDUCBA</h1>
<h4>List of operating System</h4>
<ul>
<li> Windows</li>
<li>MACINTOSH</li>
<li>LINUX</li>
<li>UBUNTU</li>
</ul>
</body>
</html>
輸出：
有不同的方法來設定文字顏色，因為 HTML 有很多可自訂的應用程式。
- 套用樣式部分
- 建立單獨的 CSS 樣式表
- 換行文字
如何使用
The styles for Html documents
Each tag to be styled with colors.