HTML - 十六進位制顏色



HTML 十六進位制顏色使用十六進位制值來定義網頁顏色,十六進位制是一種使用 16 個符號的數字系統:0-9 和 A-F。

HTML 中的十六進位制顏色程式碼

每個十六進位制顏色程式碼以井號 (#) 開頭,幷包含六位數字。前兩位數字指定紅色分量,接下來的兩位表示綠色分量,最後兩位表示藍色分量。這種方法允許對網頁設計進行精確的顏色自定義。

要在 HTML 中使用十六進位制顏色,我們可以使用**style 屬性**直接將其分配給元素,或者在**style**標籤或樣式表中使用 color 屬性來定義它們。

<element style="color: #FFFFFF;">

十六進位制顏色程式碼

以下是使用十六進位制表示法的幾種顏色的列表

顏色 顏色 HEX
  #000000
  #FF0000
  #00FF00
  #0000FF
  #FFFF00
  #00FFFF
  #FF00FF
  #C0C0C0
  #FFFFFF

HTML 十六進位制顏色的示例

以下是一些示例,展示瞭如何在 HTML 頁面中使用十六進位制顏色。

設定正文的背景顏色

這是一個使用十六進位制顏色程式碼設定 HTML 標籤背景的示例。

<!DOCTYPE html>
<html>
<head>
   <title>
      HTML Colors by HEX code
   </title>
</head>
<body style="background-color: #00FF00;">
   <p>
      Use different color code for body 
      and table and see the result. 
   </p>
   
   <p style="color: #FFFFFF;">
      This text will appear white on 
      black background. 
   </p>
</body>
</html>

在表格單元格上設定顏色

這是另一個演示 HEX 程式碼用法的示例。

<!DOCTYPE html>
<html>
<head>
   <title>
      HTML HEX Color code
   </title>
</head>
<body style="width:300px; height:100px;">
   <h2 style="background-color: #FF6666;">
      Setting the Background using HEX Code 
   </h2>
   <table style="background-color: #FF3335;">
      <tr>
         <td style="color: #FFFFFF;">
               The text color of the paragraph is 
               styled using HEX code.
         </td>
      </tr>
   </table>
</body>
</html>

結論

為網頁設計選擇合適的顏色很困難。即使您心中有顏色,您也需要讓計算機理解顏色的十六進位制值。為了簡化您的工作,我們建議您使用我們的**HTML 顏色拾取器工具。**

廣告