今天一个小哥哥终于帮我解决了这个一直以来就存在的问题:就是bootstrap中栅格里面每列都会默认带15px的内边距;有了这个,如果给每一栏加上边框,左右就会超出15px,如下图:
![](https://img.haomeiwen.com/i6896276/2d40278867381136.jpg)
图中,所有的东西都被一个container盒子包住,其中上面是一个header (为了看对比效果)下面是一个栅格布局,分为3列。以前我html结构就是这样的。
![](https://img.haomeiwen.com/i6896276/fec17e9444ef68af.png)
这样的结构写出来效果就是上面图片的那种样子。左右超出了15px,看着与header没有对齐,很不美观。这个问题从学bootstrap就一直困扰着我,用了百度中很多方法都不能解决。今天太高兴了,问了一个小哥哥,居然解决了。不多说,上代码。
![](https://img.haomeiwen.com/i6896276/f1dcc0dcadedc2f5.png)
图中的意思就是给列在加一个的父亲,再把每列的内边距清零,这样就可以抵消内边距啦。哈哈 这样是不是很简单啊,自己怎么就没有想到啊,伙伴们,不许勿喷噢。如果还有其他方法也可以给我说一说哦。
![](https://img.haomeiwen.com/i6896276/3b301e1e80bcc26e.png)
(ps最后的图稍微调整了一下下,看着要鲜明一点点。。)
网友评论