给div加上padding和border,如何不让div整体改变

Posted ryan777

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了给div加上padding和border,如何不让div整体改变相关的知识,希望对你有一定的参考价值。

最近要入门H5,遇到很多困惑,所以,每解决一个,我就要写在博客里,以防忘记!

 

给div加上padding和border,如何不让div整体改变?

如果想要实现这样的效果,只需要在这个div块中写入

box-sizing:border-box;

CSS3 box-sizing属性有3个值

1 :  content-box;

我想这个值就是一般浏览器的默认的,div的实际宽度 = div的width + pading + border;(标准盒模型)

2 :  border-box;

这个值可以不让padding盒border影响div的整体大小,div的实际宽度 = div的width (怪异盒模型)

3 :  inherit;

在子元素中写inherit可以继承父元素的box-sizing值;

 

以上是关于给div加上padding和border,如何不让div整体改变的主要内容,如果未能解决你的问题,请参考以下文章

CSS:外部DIV中有内部DIV,外部DIV的宽度300px,内部DIV宽度为100%,是按啥为基准的呢?

css内边距问题,关于使用padding后容器被撑开

border-collapse 为collapse的时候,为什么最外面框的padding不起作用了

请问下jq如何给某个div的高度赋值?

css中margin、padding、border的默认值是多少

margin padding