html td无边框颜色,table的td设置背景颜色后边框框消失

表格Table的Th Td标签在设置背景颜色后，设置的边框消失了，出现此情况主要是因为 【background】属性 与 【position:relative;】同时使用的缘故。

解决方法：对Th Td 标签增加【background-clip:padding-box;】样式属性即可解决，具体整理如下：

.TestTable4{width:200px;border-collapse:collapse;border:2px solid #678;}

.TestTable4 th, .TestTable4 td{height:32px;width:100px;text-align:center;border:1px solid #e66;background:#ded;}

.TestTable4 th, .TestTable4 td{position:relative;background-clip:padding-box;}

同时设置【background】、【position:relative;】、【background-clip:padding-box;】样式，框线正常显示。

标题1	标题2	标题3
内容1	内容2	内容3

CSS3 background-clip 属性简介：

浏览器支持情况：

IE9+、Firefox、Opera、Chrome 以及 Safari 支持 background-clip 属性。

注释：Internet Explorer 8 以及更早的版本不支持 background-clip 属性。

background-clip语法：

background-clip: border-box|padding-box|content-box;

值

描述

border-box(默认值)

背景被裁剪到边框盒

padding-box

背景被裁剪到内边距框

content-box

背景被裁剪到内容框。