本文介紹如何使用 HTML 以簡單易行的方式在網站中使用顏色。顏色在創建網站的外觀和感覺方面發揮著重要作用。 HTML 中沒有單獨的標籤;相反,它使用樣式屬性或顏色屬性。準確地說,顏色是使用層疊樣式表 (CSS) 嵌入到 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 文字套用顏色非常簡單;我們可以透過三種方式添加/更改文字的顏色,即十六進位顏色、HSL 值和顏色名稱。以下是將顏色應用到對應網頁的三種不同技術。
當應用程式直接使用這些顏色名稱時,使用英文顏色名稱非常簡單。指定顏色名稱是直接方法,W3C已經公佈了16種基本顏色(黑色、黃色、紅色、栗色、灰色、石灰、綠色、橄欖色、銀色、水色、藍色、海軍藍、白色、紫色、紫紅色、青色)
色相飽和度和亮度顏色值。色調定義為 0 到 360 度,飽和度和亮度定義為 0 到 100 %。
為了得到精確的結果,應用六位十六進位數。詳細來說,前兩位表示紅色,後兩位表示綠色,另外兩位表示藍色值,前面有「#」。
以下範例解釋了向文件應用顏色的不同方法。
代碼:
<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 有很多可自訂的應用程式。
Each tag to be styled with colors.