跳转到内容
- 标准盒模型
- margin 外边距
- margin-top
- margin-left
- margin-bottom
- margin-right
- margin:同时设置上下左右四个边的外间距
- margin:10px 20px; 设置上下为10 左右为20
- margin:10px 20px 30px 设置顶部10，左右为20 底部为30
- margin:10px 20px 30px 40px 上 右 下 左 顺序设置四个边的外间距
- border 边框
- border：四边的宽度，样式，颜色
- border-top: 宽度 样式 颜色
- border-top-width
- border-top-color
- border-top-style
- border-left
- border-right
- border-bottom
- padding 内边距
- padding:
- padding-top
- padding-bottom\
- padding-right
- padding-left
- 怪异盒模型
- box-sizing 定义当前元素使用哪种盒模型
- border-box（怪异）
- content-box (标准)
- 弹性盒模型
- display:flex 定义父容器是一个弹性盒。
- Justify-content 设置活检索弹性盒子元素在(主轴)方向上的对齐方式。
- flex-start 默认值。项目位于容器的开头
- flex-end 项目位于容器的结尾
- center 项目位于容器的中心
- space-between 项目位于各行之间留有空白的容器内。
- space-around 项目位于各行之前、之间、之后都留有空白的容器内。
- align-items 定义flex子项在flex容器的当前行的侧轴(纵轴)方向的对齐方式
- stretch 默认值，项目被拉伸以适应容器
- center 项目位于容器的中心
- flex-start 项目位于容器的开头
- flex-end 项目位于容器的结尾
- flex-grow:number 规定项目将相对于其他灵活的项目进行扩展的量。默认是0。
