-
CSS布局
-
从上到下，从左到右
-
-
脱离标准流的方法有
-
float属性
-
position属性 和 left、right、top、bottom属性
-
CSS布局-float
- float属性的常见取值有
- left：脱离标准流,浮动在父标签的最左边(默认)
-
right：脱离标准流,浮动在父标签的最右边
float-left.png
CSS布局-float用法参考
CSS布局-position（子绝父相）
| 值 | 简介 |
| : | : |
| 1.absolute | 1.生成绝对定位的元素，相对于static定以外的第一个元素进行定位； 2.元素的位置通过“left”、“right”、“top”、“bottom”属性进行规定 |
| 2.fixed | 1.生成绝对定位的元素，相对于浏览器窗口进行定位； 2.元素的位置通过“left”、“right”、“top”、“bottom”属性进行规定 |
| 3.relative | 1.生成相对定位的元素，相对于其正常位置进行定位； 2.因此，“left”：20会向元素的LEFT位置添加20的像素 |
| 4.static | 默认值，没有定位，元素出现在正常的流中（忽略“left”、“right”、“top”、“bottom”或者“z-index”）声明 |
| 5.inherit | 规定应该从父元素继承position属性的值 |
position属性.png
CSS布局-position用法参考
居中
-
所有的标签水平居中
- 行内标签和行内-块级标签居中
在父标签中设置： text-align：center - 块级标签：
让内容居中在自身中设置： margin：0 auto
- 行内标签和行内-块级标签居中
-
所有的标签垂直居中
- 行内标签和行内-块级标签居中
在父标签中设置： line-height：等于父标签的高度 -
块级标签：如图
块级标签的垂直居中方式.png
- 行内标签和行内-块级标签居中
