网页制作综合技术教程 温谦 赵伟 胡静 李占波 第14章盒子的浮动与定位.pptVIP

网页制作综合技术教程 第4部分 CSS页面布局设计 第14章 盒子的浮动与定位 14.1 盒子的浮动 14.1.1 准备代码 14.1.2 实验1——设置第1个浮动的div 14.1.3 实验2——设置第2个浮动的div 14.1.4 实验3——设置第3个浮动的div 14.1.5 实验4——改变浮动的方向 14.1.6 实验5——再次改变浮动的方向 14.1.7 实验6——全部向左浮动 14.1.8 实验7——使用clear属性清除浮动的影响 14.1.9 实验8——扩展盒子的高度 14.2 盒子的定位 （1）广义的“定位”：要将某个元素放 到某个位置的时候，这个动作可以称为定位 操作，可以使用任何CSS规则来实现，这就 是泛指的一个网页排版中的定位操作，使用 传统的表格排版时，同样存在定位的问题。 （2）狭义的“定位”：在CSS中有一个 非常重要的属性position，这个单词翻译为 中文也是定位的意思。 然而要使用CSS进行定位操作并不仅仅 通过这个属性来实现，因此不要把二者混淆。 ● static：静态定位，这是默认的属 性值，也就是该盒子按照标准流（包括浮动 方式）进行布局。 ● relative：相对定位，使用相对定 位的盒子的位置常以标准流的排版