这篇博客介绍了如何使用CSS和JavaScript来美化HTML表格，包括四种不同的样式：样式1、样式2、样式3和样式4。每种样式都有其独特的设计，如边框、背景色和字体设置。通过JavaScript函数`add_event`实现鼠标悬停时行颜色变化，以及`stripe`函数实现行的交替颜色。最后，文章提供了一个窗口加载事件，根据表格类名应用相应的样式。
除了th表格 其他行在鼠标有焦点时会改变当前颜色
表格样式body{
margin: 6px;
padding: 0;
font-size: 12px;
font-family: tahoma, arial;
background: #fff;
}
table{
width: 100%;
}
tr.odd{
background: #fff;
}
tr.even{
background: #eee;
}
div.datagrid_div{
width: 100%;
border: 1px solid #999;
}
/*****************样式1*******************/
table.datagrid1{
border-collapse: collapse;
border-bottom: 1px solid #666;
}
table.datagrid1 th{
color: #333;
padding: 3px;
font-family: monospace;
background: #9cf;
text-align: left;
border-top: 1px solid #666;
border-bottom: 1px solid #666;
}
table.datagrid1 td{
padding:
最低0.47元/天 解锁文章
扫一扫
562
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
