expression的应用之 -- 用CSS做出双色相间表格
来源:互联网 发布:随机森林算法案例分析 编辑:程序博客网 时间:2024/06/06 02:05
这是继上一篇 expression的应用之 -- 用CSS做出立体表格. 的又一篇小应用.
关于双色相间表格. 如果直接用Dreamweaver等工具做的话.
要对每一行都进行设置. 如果行数一多话,工作量非常大...
所以,结合CSS与JavaScript我们自已定义双色相间表格样式.
这样,我们要使用的时候就非常方便啦..只要在整个表格加入一个class就行了.
<SCRIPT>
//定义table的样式, cellSpacing,cellPadding.
//用obj.rows.length得出该表格的行数.
//实现奇数列时样式为tdcss1,偶数列为tbcss2.
function cooltable(obj) {
obj.cellSpacing=0;
obj.cellPadding=0;
for (i=0;i<obj.rows.length;i++) {
if(i%2==0) obj.rows(i).className = "tdcss1"
else obj.rows(i).className = "tdcss2";
}
}
</SCRIPT>
<!--定义样式-->
<STYLE>
* {font-size: 10.5pt}
.tdcss1 { BACKGROUND-COLOR: #F7F3F7; }
.tdcss2 { BACKGROUND-COLOR: #FFF7FF; }
.mytbcss {baobao:expression(cooltable(this))}
</STYLE>
<BODY>
<!--定义定义表格样式mytbcss就可以得到一个双色相间表格,再也不用一行一行地定义了.-->
<TABLE width=300 border=0 class=mytbcss>
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss1-->
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss2-->
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss1-->
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss2-->
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss1-->
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss2-->
<TR><TD>wanghr100</TD><TD>灰豆宝宝.net</TD></TR> <!--定义样式tdcss1-->
</TABLE>
</BODY>
说明:
.tdcss1 { BACKGROUND-COLOR: #F7F3F7; }
.tdcss2 { BACKGROUND-COLOR: #FFF7FF; }
.mytbcss {baobao:expression(cooltable(this))}
.tdcss1.tdcss2 这两个是定义列的样式.
当然,你可以自己做得更酷一些啦..
baobao 是自已定义的属性,你任意取个名字,用你的英文名...因为这是你自己的CSS啊.
expression()里面的语句就是JavaScript. 一定很熟悉吧..
cooltable(this)调用了前面我们写的函数.
这文章只是expression的一个小应用.看了这文章后,不知道有没有什么启发.
用expression给你的网页减减肥吧..让你的网页的代码更精减更模块化.....
- expression的应用之 -- 用CSS做出双色相间表格
- expression的应用之 -- 用CSS做出立体表格.
- 双色相间表格(CSS版)
- 双色相间表格(绝)
- 双色相间表格(绝)
- 做出漂亮的网页表格(CSS代替bordercolorlight与bordercolordark)
- css 表格的应用
- 一个用CSS做出来的聚光灯
- css深入之expression()
- Libgdx 之 饱和度与色相的渲染
- TABLE的CSS应用(细线表格)
- CSS Expression 的优化
- 利用CSS的Expression自定义属性来实现表格的OnMouseOver 特效
- css做出div圆角的效果
- CSS做出颜色饱满的按钮
- css 怎么做出黑白相间的table
- css之表格边框
- CSS之表格
- The.Net earthquake hits it(by David Chappell )
- 世界著名设计小组nrg推荐的75个FLASH酷站
- 取得ie详细版本信息.及其它版本信息的两种方法.
- 网站设计:600个经典网站...
- expression的应用之 -- 用CSS做出立体表格.
- expression的应用之 -- 用CSS做出双色相间表格
- 关于四舍五入的问题,toFixed()
- Select的OnChange()事件
- 数字日期转化为汉字日期格式...
- base64编码/解码
- 浏览器实现ACDSEE看图功能之--用鼠标移动观看图形
- 删除数组元素.
- 解密ASP源代码.
- 利用XMLHTTP无刷新获取数据.