table 隔列(行)換色效果讓表格結(jié)構(gòu)更清淅
更新時間：2012年12月25日 16:37:04 投稿：whsnow
table 隔列換色效果，很實用的一款網(wǎng)頁特效代碼，用隔行換色來修飾表格，可讓表格結(jié)構(gòu)更清淅，也更加美觀，是一個十分流行的表格特效,在網(wǎng)頁中有利于提高用戶體驗，是一個很不錯的效果，需要的朋友可以參考下
table 隔列換色效果
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
現(xiàn)在很多頁面都是使用css來實現(xiàn)
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
css3隔行換色擴展閱讀
結(jié)構(gòu)偽選擇器
顧名思議,結(jié)構(gòu)偽類選擇器是利用DOM實現(xiàn)元素過濾,也就是說它是通過文檔結(jié)構(gòu)之間的相互關(guān)系來進行匹配,從而減少文檔內(nèi)對class和平ID的定義.
| 選擇器 | 說明 |
| E:root | 匹配E所在文檔的根元素.在html文檔中,根元素就是html 標簽. |
| E:nth-last-child(n) | 選擇E元素,且它是父元素的倒數(shù)第n個子元素 |
| E:nth-of-type(n) | 選擇E元素,且它是父元素所有子元素中類型為E的子元素集合中的第n個,n可以是數(shù)字(1,2,3),關(guān)鍵字(odd,even),公式(2n,2n+3),數(shù)字是從1開始的,不是0.如p:nth-of-type(2)匹配出,<div><h1></h1><p></p><p></p></div>中第二個p元素 |
| E:nth-last-of-type(n) | 選擇E元素,且它是父元素的倒數(shù)第n個子節(jié)點 |
| E:last-child | 找出E元素,且它是父元素中的最后一個字節(jié)點 |
| E:first-of-tpe | 找出E元素,且它是父元素中是第一個該類型的元素,如p:first-of-type匹配<div><p></p><p></p>中的第一個p元素. |
| E:last-of-type | 找出E元素,且它是父元素中的最后一個該類型的元素.如:p:last-of-type匹配,<div><p></p><p></p></div>中的最后一個p元素,它同E:nth-last-of-tpe(1)意義相同 |
| E:only-child | 找出父元素中只包括一個的子元素,且該元素是E |
| E:only-of-type | 選擇其父元素只包含一個同類型的子元素,且該子元素匹配E.如p:only-of-type匹配<div><p></p></div>中的p,因為div中只包括一個p元素 |
| E:empty | 匹配E元素,且該元素不包含子節(jié)點,注意,文字也屬于節(jié)點 |
瀏覽器兼容性
| IE | Firefox | Opera | Safari | Chrome |
| IE9及以上 | 3.5及以上 | 9.6及以上 | 3.1及以上 | 1.0及以上 |
以上就是table 隔列(行)換色效果讓表格結(jié)構(gòu)更清淅的詳細內(nèi)容，更多關(guān)于隔行換色修飾表格的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
做這個焦點圖弄了大個晚上，感覺挺暈的~發(fā)上來給大家踩一下吧 雙向無縫的原理很簡單實現(xiàn)起來也不難，主要頭痛的是在前后無縫與按鈕定位之間的配合問題，不過還好現(xiàn)在總算OK了。2010-11-11
電影黑客帝國有個代碼雨效果，滿滿的既視感，身為程序猿的你羨慕嗎？只要很簡單的HTML+JavaScript就能實現(xiàn)，甚至不需要懂任何技術(shù)。這篇文章主要介紹了簡單JS打造酷炫代碼雨（黑客高逼格）,需要的朋友可以參考下2023-01-01
JavaScript檢測判斷用戶輸入的URL是否正確，簡單的正則規(guī)則，很準確的判斷URL的合法性，值得借鑒。2010-10-10
Web網(wǎng)頁對話框可拖動、關(guān)閉(自動)文字循環(huán)變化
由Js實現(xiàn)的網(wǎng)頁WEB對話框，鼠標可隨意拖動改變位置，類似于有些軟件初次運行時候彈出的每日提示，里面有文字在循環(huán)變化，時間到自動關(guān)閉,多么強大的一個web對話框啊，有興趣的朋友可以參考下啊2012-12-12
自己寫的兼容ie和ff的在線文本編輯器類似ewebeditor
最近寫了個在線的編輯器，類似ewebeditor那樣的，當然沒有人家那么強大，但是基本功能都有，而且還是兼容ie和ff的,需要的朋友可以參考下2012-12-12
table 隔列(行)換色效果讓表格結(jié)構(gòu)更清淅
table 隔列換色效果，很實用的一款網(wǎng)頁特效代碼，用隔行換色來修飾表格，可讓表格結(jié)構(gòu)更清淅，也更加美觀，是一個十分流行的表格特效,在網(wǎng)頁中有利于提高用戶體驗，是一個很不錯的效果，需要的朋友可以參考下2012-12-12
隨機顯示個性簽名的js代碼,主要是利用隨機數(shù)。需要的朋友可以參考下。2011-04-04
網(wǎng)頁煙花特效方便使用，更能給養(yǎng)眼享受，復(fù)制黏貼就能使用，快來試試吧。這篇文章主要介紹了html+JavaScript煙花3D特效（親測可用）,需要的朋友可以參考下2023-01-01
程序員的你是不是也想送個特別的禮物。今天給大家分享一個HTML+CSS+jQuery實現(xiàn)的情侶浪漫愛心表白JS特效，視覺效果還是相當不錯！得此表白神器，程序猿也可以很浪漫！快去追你的女神吧，把這個告白愛心動畫發(fā)給你心愛的她！2023-01-01
js實現(xiàn)花俏的轉(zhuǎn)動、旋轉(zhuǎn)之后慢慢張開的窗口特效
花俏的轉(zhuǎn)動的窗口，主要是使用JavaScript代碼實現(xiàn)，運行本效果后，窗口不斷旋轉(zhuǎn)，而后慢慢張開，很炫的效果，看到之后我都目瞪口呆了，真的是很炫，期待喜歡的朋友借鑒參考2012-12-12