边框
一、格式：
-
1、同时设置四条边 ：border 宽度 样式 颜色
注意点:颜色可以省略 宽度也可以省略 样式不可以省略 -
2、四条边连写
border-width ：上 右 下 左
border-style ：上 右 下 左
border-color ：上 右 下 左
注意点：
顺时针赋值 上右下左
省略时的规律
省略左边 ：和右边一致
省略下左 ： 和对边一致
省略三边 和设置的一边一致
二、内边距
padding 边框内容之间的距离就是内边距
写法 和 边框 一致
三、外边距
margin
<b>外边距在垂直方向合并</b>
四、盒子模型
- html中所有的标签都是盒子
- css3中新增了一个 box-sizing属性：能够保证盒子元素的宽高不变
- box-sizing的取值:
content-box : 元素的宽高 = 边框 + 内边距 + 内容宽高
border-box : 元素的宽高会恒等于 width 和 height
<strong>注意点:</strong>
- 1、如果两个盒子是嵌套关系 那么设置了里面一个盒子顶部的外边距，外面一个盒子也会被顶下来
- 2、如果外面的盒子不不想被一起顶下来，那么外面的盒子添加一个边框属性
- 3、企业开发中，需要控制嵌套关系盒子之间的距离，应该首先考虑padding
行高和字号
网友评论