這篇文章主要介紹了css如何設(shè)置tr中的字體顏色，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

創(chuàng)新互聯(lián)公司2013年至今，先為大興等服務(wù)建站，大興等地企業(yè)，進行企業(yè)商務(wù)咨詢服務(wù)。為大興企業(yè)網(wǎng)站制作PC+手機+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

在css中，可以通過給tr元素添加color屬性樣式來設(shè)置tr的字體顏色，具體語法格式“tr{color: 顏色值;}”；其中，顏色值可以使用顏色名、十六進制數(shù)值、RGB或RGBA、HSL等來定義。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

標(biāo)簽定義 HTML 表格中的行。

tr 元素包含一個或多個 th 或 td 元素。

一個簡單的表格是這樣的：

	
		姓名
		年齡
	
	
		Peter
		20
	
	
		Lois
		20
	

效果圖：

tr中字體顏色默認(rèn)是黑色的，那么怎么設(shè)置其字體顏色呢？

我們可以利用color屬性，該屬性可規(guī)定文本的顏色。只需要設(shè)置：

tr{
	color: #0000FF;
}

還可配合:nth-child(n)設(shè)置隔行變色效果：

tr:nth-child(odd){
	color: #0000FF;
}
tr:nth-child(even){
	color: #FFC0CB;
}

擴展：css顏色值有4種寫法：

1、使用顏色名

雖然目前已經(jīng)命名的顏色約有 184 種，但真正被各種瀏覽器支持，并且作為 CSS 規(guī)范推薦的顏色名稱只有 16 種，如下表所示。

表1：CSS 規(guī)范推薦的顏色名稱

/*名 稱	顏 色	名 稱	顏 色	名 稱	顏 色
black	純黑	silver	淺灰	navy	深藍
blue	淺藍	green	深綠	lime	淺綠
teal	靛青	aqua	天藍	maroon	深紅
red	大紅	purple	深紫	fuchsia	品紅
olive	褐黃	yellow	明黃	gray	深灰
white	殼白*/

不建議在網(wǎng)頁中使用顏色名，特別是大規(guī)模的使用，避免有些顏色名不被瀏覽器解析，或者不同瀏覽器對顏色的解釋差異。

2、十六進制顏色

十六進制符號 #RRGGBB 和 #RGB（比如 #ff0000）。"#" 后跟 6 位或者 3 位十六進制字符（0-9, A-F）。

這是最常用的取色方法，例如：

#f03
#F03
#ff0033
#FF0033

3、RGB，紅-綠-藍（red-green-blue (RGB)）

規(guī)定顏色值為 rgb 代碼的顏色，函數(shù)格式為 rgb(R,G,B)，取值可以是 0-255 的整數(shù)或百分比。

rgb(255,0,51)
rgb(255, 0, 51)
rgb(100%,0%,20%)
rgb(100%, 0%, 20%)

擴展：RGBA，紅-綠-藍-阿爾法（RGBa）

RGBA 擴展了 RGB 顏色模式，它包含了阿爾法通道，允許設(shè)定一個顏色的透明度。a 表示透明度：0=透明；1=不透明。

rgba(255,0,0,0.1)    /* 10% 不透明 */  
rgba(255,0,0,0.4)    /* 40% 不透明 */  
rgba(255,0,0,0.7)    /* 70% 不透明 */  
rgba(255,0,0,  1)    /* 不透明，即紅色 */

4、HSL，色相-飽和度-明度（Hue-saturation-lightness）

色相（Hue）表示色環(huán)（即代表彩虹的一個圓環(huán)）的一個角度。
飽和度和明度由百分?jǐn)?shù)來表示。
100% 是滿飽和度，而 0% 是一種灰度。
100% 明度是白色， 0% 明度是黑色，而 50% 明度是"一般的"。

hsl(120,100%,25%)    /* 深綠色 */  
hsl(120,100%,50%)    /* 綠色 */       
hsl(120,100%,75%)    /* 淺綠色 */

擴展：HSLA，色相-飽和度-明度-阿爾法（HSLa）

HSLa 擴展自 HSL 顏色模式，包含了阿爾法通道，可以規(guī)定一個顏色的透明度。 a 表示透明度：0=透明；1=不透明。

hsla(240,100%,50%,0.05)   /* 5% 不透明 */   
hsla(240,100%,50%, 0.4)   /* 40% 不透明 */  
hsla(240,100%,50%, 0.7)   /* 70% 不透明 */  
hsla(240,100%,50%,   1)   /* 完全不透明 */

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“css如何設(shè)置tr中的字體顏色”這篇文章對大家有幫助，同時也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識等著你來學(xué)習(xí)!