【CSS操作指南----下】

一、盒模型

HTML中的每个元素，都是一个矩形，矩形里面可以包含一些内容，就好像一个“盒子”一样~

一个盒子由以下几个部分组成：

1.边框

1.1：border-width：边框的粗细

1.2：border-style：边框的样式

1.3border-color：边框的颜色

 

为了方便， 可以使用复合写法，效果和上面的写法类似：

也可以四条边框设置不同的样式：

注意：边框会撑大盒子大小，比如高200px宽300px的盒子，设置了10px的边框，此时这个元素的大小为220px*320px~

此时我们如果不想撑大盒子，可以设置一个属性使边框不再撑大盒子：

*{

box-sizing：border-box；

}

2.内边距

 内边距也会撑大盒子~

更多复杂写法参考CSS文档~

 3.外边距