盒子模型

来源：互联网发布：大数据技术概念编辑：程序博客网时间：2024/05/17 12:19

margin 指定盒子边框与外部内容的距离既可以作用于同级元素之间，也可以作用于父级元素与子级元素之间

      div{ margin:10px;} 上下左右的边距均为10px
      div{ margin:10px 20px;} 上下边距为10px,左右边距为20px
      div{ margin:10px 20px 30px;} 上边距为10px, 左右边距为20px,下边距为30px
      div{ margin:10px 20px 30px 40px;} 上边距为10px, 右边距为20px,下边距为30px，左边距为40px

padding同理

能够在父级元素指定margin padding属性就不要在子级元素指定margin padding属性

padding 指定盒子边框与内部元素的距离

body h1等标签默认有margin属性

盒子模型中width height 表示的是盒子中内容的宽高

盒子整体的宽为margin-left + border-left + padding-left + width + padding-right + border-right + margin-right
盒子整体的高为margin-top + border-top + padding-top + height + padding-bottom + border-bottom + margin-bottom

0 0