整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
html的文件結構大家都是知道的了，總體分為head和body部分
我們要實現變色，在head部分實現格式
<style>
.tablex {border-collapse: collapse;}
.tablex tr {}
.tablex tr td {text-align:center; line-height:30px;}
.tablex tr td:hover { background-color:#f00; color:#fff;}
</style>
然后在body部分，使用table時候，注明class="tablex".這樣的話，就實現了我們所說的效果了。
附上完整代碼：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>測試鼠標移到到表格單元格背景顏色改變的</title>
<style>
.table1 {border-collapse: collapse;}
.table1 tr {}
.table1 tr td {text-align:center; line-height:30px;}
.table1 tr td:hover { background-color:#006030; color:#006030;}
</style>
</head>
<body>
<table class="table1" width="70%" border="1">
<tr>
<td>測試</td>
<td>測試</td>
<td>測試</td>
<td>測試</td>
</tr>
<tr>
<td>測試</td>
<td>測試</td>
<td>測試</td>
<td>測試</td>
</tr>
<tr>
<td>測試</td>
<td>測試</td>
<td>測試</td>
<td>測試</td>
</tr>
<tr>
<td>測試</td>
<td>測試</td>
<td>測試</td>
<td>測試</td>
</tr>
<tr>
<td>測試</td>
<td>測試</td>
<td>測試</td>
<td>測試</td>
</tr>
</table>
</body>
</html>
在任何一個瀏覽器中運行，效果如下
南大盛聯20年來一直致力于高端IT培訓--打造高級軟件人才實戰培訓專家，學生對我們的認可是我們一直前進的動力；項目團隊全球招聘，特聘來自海外的老師進行任教，采用100%商業項目進行實戰培訓，線上線下同步進行。
課程全部緊隨市場需求進行設計，并且動態進行調整；7天免費試聽，0首付開始學習，學完后進行100%推薦就業，不滿意工作崗位2次推薦。
選定一個平臺，認識一群志同道合的朋友，你的未來人生路必定不一樣。
目前已經開設下面這些培訓項目
Java培訓
安卓培訓
JavaWeb培訓
Linux培訓
云服務器布置培訓
HTML5培訓
SEO培訓
視頻剪輯培訓
UI培訓
歡迎您們分享給自己愿意分享的朋友，大家一起來進步；相互轉告，咨詢，學習。
南大盛聯培訓理念：我懂，我也能讓你懂。
格語法:
注意：顏色使用格式有三種：rgb(x,x,x) #xxxxxx colorname
<table width=""></table>指定表格的寬度大小(使用數字pixel或%)
<table border=""></table>設定表格邊框大小(使用數字pixel)
<table align=""></table>表格位置,置左,為默認值
align屬性:left(左對齊表格，默認值)、right(右對齊表格)、center(居中對齊表格)
<table bgcolor=""></table>設定表格的背景顏色
<table cellpadding=""></table>指定內容與網格線之間的間距(使用數字pixel或%)
<table cellspacing=""></table>指定網格線與網格線之間的距離(使用數字pixel或%)
<table border="1" cellspacing="0" cellpadding="0">
通常表格, 這兩個參數都設置為 0 。
<table rules="rows"></table>規定內側邊框的哪個部分是可見的。(兼容性差)
rules屬性:none 沒有線條。
groups 位于行組和列組之間的線條。
rows 位于行之間的線條。
cols 位于列之間的線條。
all 位于行和列之間的線條。
<table summary="Monthly savings for the Flintstones family"></table>
定義了表格內容的摘要：
表格結構：
在使用表格進行布局時, 可以將表格劃分為頭部、主體和頁腳, 具體如下所示：
<thead></thead>：用于定義表格的頭部, 必須位于<table></table>標記中, 一般包含網頁的logo和導航等頭部信息。
<tfoot></tfoot>：用于定義表格的頁腳, 位于<table></table>標記中<thead></thead>標記之后, 一般包含網頁底部的企業信息等。
<tbody></tbody>：用于定義表格的主體, 位于<table></table>標記中<tfoot></tfoot>標記之后, 一般包含網頁中除頭部和底部之外的其他內容。
注意：在沒有<tbody></tbody>比較的情況下, 瀏覽器會自動添加<tbody></tbody>標記。
<table bordercolor=""></table>設定表格邊框的顏色
<table cols=""></table>指定表格的欄數
<table height=""></table>指定表格的高度大小(使用數字)
<table background=""></table>背景圖片的URL=就是路徑網址(默認是repeat：水平和垂直方向重復)
<table bordercolordark=""></table>設定表格暗邊框的顏色
<table bordercolorlight=""></table>設定表格亮邊框的顏色
<tr align=""></tr> 定義表格行的內容對齊方式。
align屬性值:right、left、center、justify、char
<tr bgcolor=""></tr> 規定表格行的背景顏色。
<tr valign=""></tr> 規定表格行中內容的垂直對齊方式。
valign屬性值right、left、center、justify、char
<td colspan=""></td>指定儲存格合并欄的欄數(使用數字)
<td rowspan=""></td>指定儲存格合并列的列數(使用數字)
<td align=""></td> 調整表格字段之左右對齊
<td bgcolor=""></td> 設定表格字段之背景顏色
<td colspan="" rowspan=""></td> 表格字段的合并
<td valign=""></td> 調整表格字段之上下對齊
<td width=""></td> 調整表格字段寬度
<td nowrap="nowrap"></td> 規定表格單元格中的內容不換行(注意只有一個值:nowrap)
<caption></caption>為表格加上標題
<caption align="">設定表格標題位置
align屬性:left, center(默認值), right
<th></th> 定義表頭(粗體居中)
細表格邊框
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="158" height="68">
<tr>
<td width="158" height="68"></td>
</tr>
</table>表格創建后瀏覽器會自動添加<tbody>標簽
tml代碼里，表示顏色一般用兩種方法，一種是直接寫出顏色的英文，另一種是前面寫個“#”后面再寫6個數字字母。
先說第一種表示方法，這個很簡單，如果要表示黑色直接就是black，紅色就red，藍色就blue。具體的我們看下面圖1，圖2
圖1
圖2
現在來說第二種，這也是我們這個文章要重點說的，因為這個也是最經常用的表示方法，很多人看到這個又是字數又是字母的就糊涂了，今天我們來詳細的把它講清楚。先用圖片來說明一下，先看下面圖3
圖3
圖3里的#000000表示的是黑色，#ff0000表示紅色，#00ff00表示綠色，所以說這個效果是和圖1一樣的。那要怎么理解這種表示顏色的方法呢，我們再來列出幾個顏色和它的表示法：
紅色：#ff0000，綠色：#00ff00，藍色：#0000ff， 大家仔細看一下就可發現，這個和我們平常說的RGB格式來表示顏色是一樣的，相當于紅綠藍三個光，而f是十六進制中的0,1,2,.....e,f中的f了 。f是里面的最大值了，ff代表該顏色光的值達到最大，所以#ff0000是紅色，#880000表示的也是紅色，只是沒有#ff0000這個那么紅了。其他的也是同理。所以#000000代表三個顏色光的值都為0，沒有任何光了，那就是黑色了，相反#ffffff代表三個顏色光的值都達到最大，混合在一起就成白色。我們也知道紅光和藍光混在一起是紫色的，所以#ff00ff表示的是紫色，同樣#ffff00表示的是黃色。講到這里相信大家應該都明白了怎樣用這種方法表示顏色了吧，如果要表示一種顏色，只要把相應的值增加或減小或者添加另一個顏色，這樣就可以得到千千萬萬種顏色了。
這兩種表示顏色的方法都講完了，尤其是第二種方法，大部分情況都是用這種方法來表示html里面的顏色的。如果大家有什么更好的更容易理解的想法，可以點擊關注【點點有你】一起來討論一下哦
最后，如果您覺得我寫的這些文章對您有幫助的話，您可以根據您的情況隨意給點賞金，我相信一分也是愛也是支持，下面兩圖是我的支付寶和微信收款碼。當然寫文章不是一定要讓您給賞金的，有您的支持和贊助，我會有更多動力來寫文章和大家分享的，再次感謝您的支持和理解！
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
