一．1.CSS的盒子模型
(-).页面布局的三大核心：盒子模型，浮动和定位
2.盒子模型的组成：
(1) a.边框：border设置元素的边框，边框是由三部分组成：边框的宽度，样式，颜色 ；
语法：border：borderwi-dth border--style border-color；
(2)边框会影响盒子的实际大小：
解决方法：如果我们去页面上量盒子的时候，需要width/height减去边框的宽度*2
(3)给表格是指细线边框：将相邻的单元格连在一起
border-collapse：collapse
2.内边距：
1.属性名：padding 边框和内容之间的距离
2.属性值：-left ，-right ，-top ，-bottom 左右上下内边距
3.padding：依次代表的上 右 下 左
4.padding 不会撑开盒子的情况；如果盒子没有指定宽度就不会撑开，指定宽度就会撑开
5.不想让盒子撑开就和border 不会让撑开的处理方式一样a
3.外边距:
1.分别设置各个方向的外边距：
Margin-left：左 -right：右
2.外边距的简写：同 border
3.外边距的典型应用
1.将块级盒子进行水平居中：必须满足的条件：盒子必须有宽度，左右的外边距设置为auto。
2.外边距的合并
3.清除、内外边距
二．圆角搜索框：
1.在CSS种使用border-radius属性来设置圆角边框
2.语法：border-radius：像素值/百分比： 代表是圆的半径；
如果画正圆形 写成高度的一半，也可以写成50%
如果要设置四个角的圆角边框不一致;
border-top-left-radius;border-top-right-radius;border-bottom-left-radius;border-bottom-right-radius
3.CSS的盒子阴影：
box-shadow
属性为盒子添加阴影：
h-shadow 必须值，水平阴影的位置，允许有负值
v-shadow必须值，垂直阴影的位置，允许有负值
blur可选 模糊距离 spread 阴影的尺寸；
color 阴影颜色 inset
外部阴影是outset
内部阴影是inset
注意点：默认的阴影是外部阴影 但是不可以在box-shadow里面写这个属性，否则会使阴影消失，；阴影不会影响盒子的排列
|
