第9章 CSS浮动布局.pptx

;案例说明;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;支撑知识点;clear属性;; float属性可用于任何HTML元素。设置了浮动属性的元素遵循如下规则： （1）浮动元素的边距不会产生重叠。 （2）只有元素中的内容会受到浮动元素的影响。也就是说背景、边距、边框、填充等盒子模型相关属性不受影响。 （3）浮动元素均被视为块级元素，元素的实际宽度和高度由边距、边框、填充、宽度和高度属性决定。;;方法一：两个元素都左浮动或都右浮动;方法二：第一个左浮动，第二个右浮动;方法三：第一个左浮动，第二个设置左边距（此时左边的div需要设置宽度）;方法四：第一个右浮动，第二个设置右边距;; 为使段落p不受浮动元素的影响，需要给p标签加上clear属性，css代码如下。;; 要想阻止行框???绕浮动框，需要对该行框应用clear属性。此外，还可在被清理的元素的上外边距上添加足够的空间，使元素的顶边缘垂直下降到浮动框下面。; 假设希望一个图像浮动到文本块的左边，并且希望这幅图像和文本包含在另一个具有背景颜色和边框的元素中，您可能编写文中的代码。;案例说明;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例说明;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例说明;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤;案例步骤