继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

一些对margin,padding和定位的认识

慕粉昵称已占用
关注TA
已关注
手记 2
粉丝 37
获赞 36

块元素之间或者边框之间的距离一般都 用margin,包括块元素和边框之间的距离。
内联元素之间的距离一般都用padding,包括内联元素与边框之间的距离。

不理解padding的话,就理解成补白就好了。

还可以这样理解:三种元素:inline/block/inline-block

每一个块元素都是相当于一个盒子,描述盒子里面的东西是padding,描述盒子外面的是margin,当你想设置这个盒子(这里是块元素)与别的元素(边框或元素)的距离的时候,用margin。

当你想设置盒子里面的内容之间的距离的时候,用padding去撑开他们,当父元素设置了宽高属性后,padding会撑大父元素盒子,减少父元素盒子的宽高就好。

定位:position: relative/ absolute/ fixed/
绝对定位:absolute,父级元素有relative的时候,是相对于父元素定位的,父元素没有relative的时候是相对于浏览器body定位的。absolute绝对定位,会跳出普通文档流,会拉高层级,元素移动后后面的元素会跟上来。

相对定位:relative,不管父级有没有定位元素,都是相对于父元素定位的,relative移动了,后面的元素不会跟上来填补空缺。父级使用relative可以控制absolute的移动范围。

固定定位: fixed,固定在电脑的可视窗口位置,不会随着滚动条移动变化。

打开App,阅读手记
2人推荐
发表评论
随时随地看视频慕课网APP

热门评论

很容易理解的说明 谢了楼主

查看全部评论