站長(zhǎng)資訊網(wǎng)
實(shí)現(xiàn)步驟：1、通過(guò)id獲得td元素，語(yǔ)法“document.getElementById('id值')”，會(huì)返回一個(gè)指定td對(duì)象；2、利用Style對(duì)象的backgroundColor屬性設(shè)置td對(duì)象的bgcolor背景顏色，語(yǔ)法“指定td對(duì)象.style.backgroundColor="顏色值"”。
前端（vue）入門(mén)到精通課程：進(jìn)入學(xué)習(xí)
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API調(diào)試工具：點(diǎn)擊使用
本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。
td的bgcolor屬性（背景顏色）
bgcolor 屬性規(guī)定單元格的背景顏色。
<table border="1"> <thead> <tr><th>姓名</th> <th>性別</th> <th> 年齡 </th></tr> <thead> <tbody> <tr><td bgcolor="#00FF00">劉德華</td> <td>男</td> <td> 56 </td></tr> <tr><td bgcolor="#FF0000">張學(xué)友</td> <td>男</td> <td> 58 </td></tr> <tr><td>郭富城</td> <td>男</td> <td> 51 </td></tr> <tr><td>黎明</td> <td>男</td> <td> 57 </td></tr> </tbody> </table>
javascript設(shè)置td的bgcolor背景顏色
在javascript中，可以利用Style對(duì)象的backgroundColor屬性來(lái)設(shè)置背景顏色。
實(shí)現(xiàn)步驟：
步驟1、通過(guò)id獲得td元素
document.getElementById('id值')
返回指定td對(duì)象
步驟2：利用Style對(duì)象的backgroundColor屬性來(lái)設(shè)置指定td對(duì)象的背景顏色
指定td對(duì)象.style.backgroundColor="顏色值"
實(shí)現(xiàn)示例：
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script> function changeStyle() { document.getElementById('bg').style.backgroundColor = "#FFCC80"; // document.getElementById('bg').style.backgroundColor="red"; } </script> </head> <body> <table border="1"> <thead> <tr> <th>姓名</th> <th>性別</th> <th> 年齡 </th> </tr> <thead> <tbody> <tr> <td id="bg">劉德華</td> <td>男</td> <td> 56 </td> </tr> <tr> <td>張學(xué)友</td> <td>男</td> <td> 58 </td> </tr> <tr> <td>郭富城</td> <td>男</td> <td> 51 </td> </tr> <tr> <td>黎明</td> <td>男</td> <td> 57 </td> </tr> </tbody> </table><br> <input type="button" onclick="changeStyle()" value="改變背景顏色" /> </body> </html>
說(shuō)明：顏色值的寫(xiě)法
1、使用顏色名
規(guī)范推薦的顏色名稱(chēng)
/*名 稱(chēng) 顏 色 名 稱(chēng) 顏 色 名 稱(chēng) 顏 色 black 純黑 silver 淺灰 navy 深藍(lán) blue 淺藍(lán) green 深綠 lime 淺綠 teal 靛青 aqua 天藍(lán) maroon 深紅 red 大紅 purple 深紫 fuchsia 品紅 olive 褐黃 yellow 明黃 gray 深灰 white 殼白*/
不建議在網(wǎng)頁(yè)中使用顏色名，特別是大規(guī)模的使用，避免有些顏色名不被瀏覽器解析，或者不同瀏覽器對(duì)顏色的解釋差異。
2、十六進(jìn)制顏色
十六進(jìn)制符號(hào) #RRGGBB 和 #RGB（比如 #ff0000）。"#" 后跟 6 位或者 3 位十六進(jìn)制字符（0-9, A-F）。
這是最常用的取色方法，例如：
#f03 #F03 #ff0033 #FF0033
3、RGB，紅-綠-藍(lán)（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%)
擴(kuò)展：RGBA，紅-綠-藍(lán)-阿爾法（RGBa）
RGBA 擴(kuò)展了 RGB 顏色模式，它包含了阿爾法通道，允許設(shè)定一個(gè)顏色的透明度。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)（即代表彩虹的一個(gè)圓環(huán)）的一個(gè)角度。
飽和度和明度由百分?jǐn)?shù)來(lái)表示。
100% 是滿飽和度，而 0% 是一種灰度。
100% 明度是白色， 0% 明度是黑色，而 50% 明度是"一般的"。
hsl(120,100%,25%) /* 深綠色 */ hsl(120,100%,50%) /* 綠色 */ hsl(120,100%,75%) /* 淺綠色 */
擴(kuò)展：HSLA，色相-飽和度-明度-阿爾法（HSLa）
HSLa 擴(kuò)展自 HSL 顏色模式，包含了阿爾法通道，可以規(guī)定一個(gè)顏色的透明度。 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) /* 完全不透明 */
5、transparent
特殊顏色值，表示透明色。可以直接當(dāng)做顏色使用。
【
