本文介绍了使用CSS使表格的外框颜色与单元格的边框颜色不同的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我要使用CSS设置表格外边框的颜色. 则内部单元格将具有不同的边框颜色.
我创建了如下内容：
table {
border-collapse:collapse;
border: 1px solid black;
}
table td {
border: 1px solid red;
}
问题是，表的颜色改变并变为红色，如您在此处所见：http://jsfiddle.net/JaF5h/
如果将表格边框宽度增加到2px，则可以工作：http://jsfiddle.net/rYCrp/
我处理CSS和跨浏览器问题已经很长时间了……这是我第一次面对这样的事情，我完全被困住了…不知道该怎么办！
有谁知道如何使用BORDER-WIDTH：1px进行固定吗？
推荐答案
我将使用相邻选择器来实现此目的，如下所示：
table {
border: 1px solid #000;
}
tr {
border-top: 1px solid #000;
}
tr + tr {
border-top: 1px solid red;
}
td {
border-left: 1px solid #000;
}
td + td {
border-left: 1px solid red;
}
这有点重复，但它通过分别设置第一行和第一列的上边界和左边界，然后用红色覆盖"内部"行和单元格，从而获得您想要的效果。
这在IE6中当然不起作用，因为它不理解相邻的选择器。
http://jsfiddle.net/JaF5h/36/
这篇关于使用CSS使表格的外框颜色与单元格的边框颜色不同的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！