CSS實作表格的背景兩色漸層_CSS/HTML

原理是使用Alpha 濾鏡在每個表格上加上一個透明漸變，由table的背景顏色控制，單一td控制另一色漸變
Alpha 濾鏡 
語法：{FILTER：ALPHA(opacity=opacity, finishopacity=finishopacity,style=style,startx=startx,starty=starty,finishx=finishx,finishy=finishy)} 
Filter: Alpha(Opacity=100, FinishOpacity=0, SStart 0, FinishX=0, FinishY=100);

'Alpha'屬性是把一個目標元素與背景混合。設計者可以指定數值來控制混合的程度。這種「與背景混合」通俗地說就是一個元素的透明度。透過指定座標，可以指定點、線、面的透明度。他們的參數意義分別如下： 
「opacity'代表透明度水準。預設的範圍是從0 到 100，他們其實是百分比的形式。也就是說，0代表完全透明，100代表完全不透明。」finishopacity'是一個可選參數，如果想要設定漸層的透明效果，就可以使用他們來指定結束時的透明度。範圍也是0 到 100。 「style' 參數指定了透明區域的形狀特徵。其中0代表統一形狀、1代表線形、2代表放射狀、3代表長方形。」STARTX「和」STARTY「代表漸變透明效果的開始X和Y座標。」FINISHX 「和」FINISHY「代表漸變透明效果結束X和Y 的座標。

<style type="text/css"> <!-- .xr td { font-family: "Tahoma"; font-size: 12px; font-weight: bold; text-align: center; Filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=0, StartY=0, FinishX=0, FinishY=100); } table { font-family: "Tahoma"; font-size: 12px; } --> </style> <table width="80%" border="0" cellpadding="5" cellspacing="1" bgcolor="#003399"> <tr bgcolor="#FFFFFF" class="xr"> <td width="20" bgcolor="#00FFFF">ID</td> <td bgcolor="#99FF00">Name</td> <td bgcolor="#FF0000">ICQ</td> <td bgcolor="#FFCC00">MSN</td> <td bgcolor="#66CC00">Homepage</td> <td bgcolor="#003366">Date</td> <td bgcolor="#CC3300">Content</td> </tr> <tr align="center" bgcolor="#FFFFFF"> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </table>
[Ctrl+A 全選 註:如需引入外部Js需刷新才能執行]