當前位置：首頁 > 前端技术 > CSS >内容正文

CSS

CSS基础(part6)--CSS的颜色表示

發布時間：2023/12/19 CSS 35 豆豆

生活随笔收集整理的這篇文章主要介紹了 CSS基础(part6)--CSS的颜色表示小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

學習筆記，僅供參考，有錯必糾

參考自：CSS中文文檔

文章目錄

- CSS
- - CSS的顏色表示
  - - 命名顏色
    - RGB顏色表示法
    - 十六進制顏色表示法

CSS

CSS的顏色表示

命名顏色

直接拿顏色的英文形式作為color的屬性值，比如：red, black, white, green, silver等等。

舉個例子

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>OK</title><style>h2 {color: pink;}</style></head> <body><h2>俺是一個標題</h2> </body> </html>

頁面：

RGB顏色表示法

RGB顏色值指定：RGB(紅，綠，藍)。每個參數(紅色，綠色和藍色)定義顏色的亮度，可在0和255之間，或一個百分比值(從0％到100％)之間的整數。比如，RGB(0,0,255)值呈現為藍色，因為藍色的參數設置為最高值(255)而其他設置為0。

舉個例子

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>OK</title><style>h2 {color: rgb(255, 255, 0);}</style></head> <body><h2>俺是一個標題</h2> </body> </html>

頁面：

十六進制顏色表示法

由于RGB模式書寫非常不方便，所以我們用十六進制數代替0到255；

十六進制的顏色其組成部分是：＃RRGGBB，其中RR代表紅色，GG代表綠色和BB代表藍色，所有值必須介于0和FF之間；

十六進制顏色表示法的取值范圍是#000000 ~ #FFFFFF(黑色到白色)；

十六進制表示法其實就是RBG表示法的另一種寫法。

舉個例子

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>OK</title><style>h2 {color: #ff0000;}</style></head> <body><h2>俺是一個標題</h2> </body> </html>

頁面：

總結

以上是生活随笔為你收集整理的CSS基础(part6)--CSS的颜色表示的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：阴阳师涂壁哪里多阴阳师悬赏封印涂壁快速
下一篇：联通手机号如何办理挂失