htmltbody边框,tbody边框呈现问题
我正在使⽤angularJS来ng重复搜索结果的数量，以便在表中显⽰它们。每个结果由许多表格⾏和列组成，因此ngRepeat正在重复容器以包含完整的结果。tbody边框呈现问题
我遇到的问题是围绕每个tbody的边框造型。每个边框将在⿏标悬停时从透明转换为指定的颜⾊，但是由于默认的border-collapse: collapse；属性，边框的边缘会出现重叠，这使得它们显得截⽌，并且通常会断开。如果我使⽤border-collapse: separate；和display: block;，我可以使边框显⽰正确，但是我失去了表格通常提供的很好的⽔平间距。
html表格内外边框颜我的⽬标是让每个tbody拥有⾃⼰的边框，以便在⿏标悬停时转换颜⾊，同时保持表格顶部显⽰的th标签的适当⽔平间距。
这⾥是什么，我有⼀个简化版：
HTML：
Heading 1Heading 2Heading 3
{{result.a}}{{result.b}}{{result.c}}
{{result.d}}
CSS：
tbody {
transition: border-color 0.6s ease;
-webkit-transition: border-color 0.6s ease; /* Safari */
border 4px solid black;
}
tbody:hover {
border-color: red;
}
在此先感谢。
+0
究竟哪个尴尬？我可以看到⼏个。我制作了[jsfiddle](jsfiddle/z72pL/5/)，在Chrome上看起来不错，但在其他各种浏览器上有不同的问题。 –
+0
感谢您的回复，以及jsfiddle，因为它更清楚地说明了这个问题。请注意，每个表格边界的四边不会同时淡⼊和淡出。有时⿏标悬停的转换正在应⽤，⽽其他时间则不会。我的⽬标是将⿏标上的转换均匀地应⽤到特定tbody的各个⽅⾯，就像它通常那样。 –

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。