十、布局
10.1浮动定位说明图
10.2什么是浮动定位
1）将元素排除在普通流之外。
2）将浮动元素放置在包含框的左边或者右边。 3）浮动元素依旧位于包含框之内！ 4）浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框为止！ ? 注意事项：流模式：从上到下，从左到右 10.3浮动定位移动图
10.4 float属性
1）语法：设置浮动，float:none/left/right; 2）取值说明：
①none：默认值。对象不飘浮 ②left：文本流向对象的右边 ③right：文本流向对象的左边
12
? 注意事项：
? 多元素浮动，建议高度都一样。
? 多元素飘在同一行，要确认总长度不超过父元素的长度。
? 某个元素浮动，可能会影响后续的元素，后续的元素自动向上补齐！
10.5 clear属性
clear属性用于清除某测浮动元素所带来的影响。 1）语法：clear:none/left/right/both; 2）取值说明：
①none：默认值。允许两边都可以有浮动对象 ③right：不允许右边有浮动对象 ②left：不允许左边有浮动对象
④both：不允许有浮动对象 例如：p text
--->
十一、列表样式
特定于列表元素。
11.1列表项前的标识符号图像
1）语法：list-style-image:none/url(url); 2）取值说明：
①none：默认值，不指定图像。
②url(url)：使用绝对或相对url地址指定图像。 ? 注意事项：若此属性值为none或指定url地址的图片不能被显示时，list-style-type
属性将发生作用。
11.2列表项前使用的预设标识符号
1）语法：list-style-type:disc/circle/square/decimal/none; 2）取值说明：
①disc：默认值，实心圆 ②circle：空心圆 ③square：实心方块 ④decimal：阿拉伯数字 ⑤none：不使用项目符号
十二、定位 12.1定位概述
1）普通定位：
页面中的块级元素框从上到下一个接一个地排列，每一个块级元素都会出现在一个新行中，内联元素将在一行中从左到右排列水平布置。
2）浮动定位：见第十章。 3）相对/绝对定位。
12.2 position（定位）属性 更改定位模式为相对定位、绝对定位、固定定位 1）语法：position:static/absolute/fixed/relative; 2）取值说明：
①static：默认值。无特殊定位，元素遵循HTML定位规则（即默认的流布局模式） ②absolute：将元素从文档流中拖出，使用left、right、top、bottom等属性相对于最
近的有position属性的祖先元素，如果没有，那么它的位置相对最初的包含块，比如按
进行绝对定位。而其层叠通过z-index属性定义③relative：元素不可层叠，但将依据 left、right、top、bottom等属性在正常文档流
中偏移位置
④fixed：元素定位遵从绝对定位，但是要遵守一些规范。低版本的IE中，这个属性
无效
12.3偏移属性
实现元素框位置的便宜。
1）语法：top/bottom/right/left:auto/length;
14
2）取值说明：
①auto：默认值，无特殊定位，根据HTML定位规则在文档流中分配。 ②length：由浮点数字和单位标识符组成的长度值/百分数。必须定义position属性值
为absolute或者relative此取值方可生效
12.4堆叠属性
1）语法：z-index:auto/number; 2）取值说明：
①auto：默认值，为0，遵从其父元素的定位。 ②number：无单位的整数值，可为负数。 ? 注意事项：
? 较大number值的元素会覆盖在较小number值的元素之上。如两个绝对定位元素的此属性具有同样的number值，那么将依据它们在HTML文档中声明的顺序层叠。
? 此属性仅仅作用于position属性值为relative或absolute的元素。 ? 默认布局使用堆叠无效。
12.5相对定位：relative
1）元素仍保持其未定位前的形状。 2）原本所占的空间仍保留。
3）元素框会相对它原来的位置偏移某个距离。 4）在相对定位元素之后的文本或元素占有他们自己的空间而不会覆盖被定位元素的自然空间。
5）相对定位会保持元素在正常的HTML流中，但是它的位置可以根据它的前一个元素进行偏移。
6）在相对定位元素在可视区域之外，滚动条不会出现。
12.6绝对定位：absolute 1）绝对定位会将元素拖离出正常的HTML流，而不考虑它周围内容的布局。
2）要激活元素的绝对定位，必须指定left、right、top、bottom属性中的至少一个。 3）绝对定位元素之后的文本或元素在被定位元素被拖离正常HTML流之前会占有它的自然空间。
4）绝对定位元素在可视区域之外会导致滚动条出现。
15