开发者社区> 问答> 正文

什么情况下,padding比margin更好啊

我们都知道 padding 和 margin 都可以用来定位,但是有时用 padding 比 margin 更好,比如margin 的上下边距合并。具体在那些情况下,用 padding 比用 margin 更好啊?

展开
收起
杨冬芳 2016-06-02 11:01:23 2457 0
2 条回答
写回答
取消 提交回答
  • php是世界上最好的语言

    关注一下

    2019-07-17 19:24:19
    赞同 展开评论 打赏
  • IT从业

    从实用价值考量:
    •背景可以铺到padding区域,而不能铺到margin区域
    控制背景裁剪的background-clip不支持margin-box,换言之,无论如何,背景都无法铺到margin区域中
    •对于块级元素,若其width不为auto/default,可以设置margin: auto,可用于水平或垂直(需额外设置)方向上的自动居中,padding则无此功能
    •margin有折叠行为,padding则无
    在子元素之上写margin表达子元素和父元素之间的留白时,需要在父元素上加入BFC,否则margin会与父元素折叠。padding则无此后顾之忧
    •margin可以设置为负值,padding则无法设置为负值
    margin负值可以让元素交叠,或撑宽元素的内容区域,这在有一定间隙的列表布局中极其有用


    从实用价值考量:
    •背景可以铺到padding区域,而不能铺到margin区域
    控制背景裁剪的background-clip不支持margin-box,换言之,无论如何,背景都无法铺到margin区域中
    •对于块级元素,若其width不为auto/default,可以设置margin: auto,可用于水平或垂直(需额外设置)方向上的自动居中,padding则无此功能
    •margin有折叠行为,padding则无
    在子元素之上写margin表达子元素和父元素之间的留白时,需要在父元素上加入BFC,否则margin会与父元素折叠。padding则无此后顾之忧
    •margin可以设置为负值,padding则无法设置为负值
    margin负值可以让元素交叠,或撑宽元素的内容区域,这在有一定间隙的列表布局中极其有用

    2019-07-17 19:24:19
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
Top 5 mistakes when wriiting a 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载