外边距内边距

Posted ajaxa

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了外边距内边距相关的知识,希望对你有一定的参考价值。

 内边距:

技术分享图片

 

浏览器结果:

技术分享图片

 

 

给div1加上内边距padding   --->   padding: 30px;

技术分享图片

 

 结果为:内容的和边框的距离上线左右增加了30px 下面的div2不变 

技术分享图片

 

外边距:  给div1加上内边距margin ----> margin: 30px

 

技术分享图片

 

 浏览器结果:div 边框上线左右与其他标签距离增加了30px  

技术分享图片

 

 

 

 

 

 

以上是关于外边距内边距的主要内容,如果未能解决你的问题,请参考以下文章

209.4.4 盒模型&定位&浮动

html所有关于内边距外边距的标签属性

内边距,外边距说明-----壹

jq获取元素的宽高(内边距和外边距)

内边距、边框和外边距(三)

CSS:仅在边距内的背景颜色