我将屏幕分成了许多
,使它们相互粘贴(比如说,像棋盘一样,但是每个方格的大小不同)。我使用百分比(相对于父容器)设置了高度和宽度。现在,当我给div添加border: 1px时,所有的布局都破坏了...... 我想象中,边框会在每个边上添加1px,解决办法是添加一些内部边框。我能否以某种方式添加这样的内部边框?
您可以使用box-sizing: border-box
,使边框的宽度成为元素的width
的一部分。
.example {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
使用轮廓属性。与边框属性不同,它不会“添加”到元素的高度或宽度。但是,与边框属性不同的是,您不能具有左,右,底部或左个别属性。虽然您可以具有轮廓样式,轮廓宽度和轮廓颜色属性。
您可以通过减少 0.5
来将百分比降至 49.5%
。编辑:Outset 不起作用,感谢 @thirty。
border:1px
时,宽度会变得比以前更长。为了解决这个问题,我建议你应该在父级div之后再加上另一个div
来防止调整宽度。padding
和margin
,这样它就会将所有子div包裹在一起。 - Tepken Vannkorn