最近帮朋友解决一个前端的小应用,然后对方指明说他们公司必须要用bootstrap。我之前从未使用过现成库,刚一接触觉得确实还不错,不过在自己写一些不在库包含的前端组建时,发现css不听话了。发仔细研究才发现是盒子模型很妖怪,似乎是内外盒子模型的感觉。
一旦设置了高度或者宽度发现无论你设置margin或者padding或者border之类的,你的总size是不变的,好吧这点用起来却是也算方便,这里我也是能理解的。
问题出现了,发现设置上下padding 的时候,
发现第二个下面元素的padding-top和前一个元素的padding-bottom重叠了
,额,这样无奈,我padding-bottom设置的数值必须减去下一个元素的padding-top才能得到正确的值
,虽然问题可以解决,但是这点让我十分不解
请对前端比较了解的朋友告知,解答我心中的疑惑。
我猜测是不是有些元素设置了 box-sizing属性为border-box,关于这个样式,自行百度,手机打字不方便啊。关于第二个问题,在jsbin上重现一下,方便大家帮你解决。