简单的Table隔行变色

简介:

简单的Table隔行变色

 
  1. <style type="text/css"> 
  2. <!-- 
  3. .first {background:#ffffff;} 
  4. .gray {background:#ECFBFF;} 
  5. --> 
  6. </style> 
  7. <table border="1" width="900" cellpadding="0" cellspacing="0"> 
  8.     <tr onmouseover="this.className='gray'" onmouseout="this.className='first'"> 
  9.         <td width="500">aaa</td> 
  10.         <td width="400">bbb</td> 
  11.     </tr> 
  12.     <tr onmouseover="this.className='gray'" onmouseout="this.className='first'"> 
  13.         <td>ccc</td> 
  14.         <td>ddd</td> 
  15.     </tr> 
  16. </table> 

 

      本文转自许琴 51CTO博客,原文链接:http://blog.51cto.com/xuqin/1109003,如需转载请自行联系原作者


相关文章
element ui table 表格高度自适应
设置element ui table 表格高度自适应
1932 0
|
27天前
|
JavaScript 前端开发 索引
Element_Table的单元格合并
Element_Table的单元格合并
|
2月前
element-plus table表格cell-style的使用
element-plus table表格cell-style的使用
32 1
|
6月前
element Table表格隐藏列
element Table表格隐藏列
106 0
|
10月前
|
JavaScript
element:table 单选
element:table 单选
122 0
element:table 单选
|
前端开发
el-table表格还可以这么玩
我们都知道表格是横向渲染的,一行一行去展示。不过博主这里有个需求是纵向渲染,一列一列去展示,下面是全部代码,分享出来或许能帮到你们
242 1
el-table表格还可以这么玩
|
JavaScript
element-ui:el-table合并单元格后的行高亮显示
element-ui:el-table合并单元格后的行高亮显示
659 0
element-ui:el-table合并单元格后的行高亮显示
|
JavaScript
Element UI - el-table-column 属性之 show-overflow-tooltip 爬坑
Element UI - el-table-column 属性之 show-overflow-tooltip 爬坑
2026 0
Element UI - el-table el-table-column 表头自定义
Element UI - el-table el-table-column 表头自定义
584 0
Element UI - el-table el-table-column 表头自定义
|
存储 前端开发 JavaScript
Element el-table 表格详解
本文目录 1. 前言 2. 基本用法 3. 显示斑马纹 4. 显示边框 5. 自定义尺寸 6. 显示索引 7. 显示内容过长时的提示 8. 自定义行样式 9. 固定表头 10. 固定列 11. 多级表头 12. 展开行 13. 自定义列模板 14. 单选 15. 多选 16. 前端排序 17. 小结
2711 0
Element el-table 表格详解