1

我有一个表格（一个日历），并且在每个 td 元素上都有一个 CSS 悬停。我在这个悬停上设置了一个边框，但是它弄乱了单元格的宽度和高度（即新的边框会将下一行稍微向下推，等等）

有什么办法解决这个问题吗？

4

3 回答 3

2

您可以通过在所有 td 元素上使用与 td 背景颜色相同的边框来解决问题，并且只更改边框的颜色（而不是宽度）以获得与您最初设计的效果非常相似的效果，而不会弄乱宽度和高度。

原始边框对用户来说是不可见的，因为它的颜色与背景相匹配。

于 2012-09-28T23:56:07.250 回答
1

你可以（如果悬停没有通过过渡平滑）在盒子上有一个填充（比如说 5px），在悬停时你可以添加 2px 的边框并使填充 3px，所以它仍然与 5px 的距离盒子的末端。

于 2012-09-29T00:00:59.960 回答
0

CSS 因这样做而臭名昭著，因为“边框”属性不会添加到对象的总高度中。它的行为类似于边距。您可以做的是在 CSS 文件中的 <td> 选择器中添加一些边距规则：

td.hoverable {
  border:1px solid #00F;
  margin:-1px;
}

这样当您悬停时，新的“边距”规则也会生效，从而将 <td> 的面积减少 1px，这应该允许边框显示。

编辑：哎呀，是的。我的意思是margin:-1px;:) 谢谢！

于 2012-09-28T23:56:28.053 回答