html给表格用选择器填充颜色,使用css选择器实现表格隔行换色

使用css选择器实现表格隔行换色

*{

margin: 0;

padding: 0;

}

body{

padding: 200px;

box-sizing: border-box;

}

table{

border-collapse: collapse;

}

td,th{

color: #000;

font-size: 16px;

line-height: 30px;

border: 1px solid #333;

padding: 0 15px;

box-sizing: border-box;

}

tbody tr:nth-child(odd){

background: rgba(204,255,255,.6);

}

共享博客共享博客共享博客共享博客共享博客共享博客

设置表格奇数行变色tbody tr:nth-child(odd){

background: #f7f8f9;

}

设置表格偶数行变色table tr:nth-child(even){

background: #f7f8f9;

}

扩展一&＃xff1a;表格边框合并table{

border-collapse: collapse;

}

扩展二&＃xff1a;带有 thead、tbody、tfoot 元素的 HTML 表格

标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

标签定义表格的页脚(脚注或表注)

标签表格主体(正文)。该标签用于组合 HTML 表格的主体内容。

相关教程

分享

分享海报

扫一扫 - 分享本文

打赏

微信

扫一扫 - 打赏鹏仔

收藏

请按下 Ctrl &＃43; D

即可收藏当前文章

手机看

分享到微信朋友圈

扫一扫 - 手机阅读

侵权投诉

侵权、举报、建议

↓