image.png
    image.png

    1边框 border
    image.png
    边框样式这三个已经够用了
    image.png

    image.png

    image.png

    image.png

    2内边距 padding
    image.png
    内边距简写（重要）

    image.png
    最后一个容易错，是顺时针设置的（上右下左）

    内边距也会改变盒子大小
    image.png
    如果不想剪掉，在嵌套时就不要设置宽、高，就不会超过父亲宽高大小。不用减
    image.png

    3外边距 margin
    image.png
    image.png

    利用外边距实现盒子的居中（非常重要！！！）
    image.png

    image.png
    例如span行内元素 或者img行内块元素的水平居中都可以通过text-align：center来实现

    垂直外边距的嵌套问题
    image.png
    重点记住overflow：hidden，不会改变盒子大小

    4清除内外边距
    image.png
    image.png