盒子模型
所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子，也就是一个盛装内容的容器。每个矩形都由元素的内容、内边距（padding）、边框（border）和外边距（margin）组成。
（图片来源网络，侵删。谢谢）
盒子边框（border）
盒子边框（border）
语法：
border : border-width || border-style || border-color
边框属性—设置边框样式（border-style）
边框样式用于定义页面中边框的风格，常用属性值如下：
圆角边框(CSS3)
语法格式：
border-radius: 左上角 右上角 右下角 左下角; | border-radius: 全体；
内边距（padding）
padding属性用于设置内边距。 是指 边框与内容之间的距离。
注意： 后面跟几个数值表示的意思是不一样的。
外边距（margin）
margin属性用于设置外边距。 设置外边距会在元素之间创建“空白”， 这段空白通常不能放置其他内容。
margin:上外边距 右外边距 下外边距 左外边
取值顺序跟内边距相同。
盒子阴影
- 前两个属性是必须写的。其余的可以省略。
- 外阴影 (outset) 但是不能写 默认 想要内阴影 inset