(通过指定CSS属性float的值,使元素向左或向右浮动,然后由后继元素向上移动以填补前面元素的浮动而空出的可用空间。)
CSS的float属性，作用就是改变块元素(block element)对象的默认显示方式，HTML标签设置了float属性之后，它将不再独自占据一行
(从当前位置开始到这行结束,不包括标签前面的格子,即这一行包括前面标签+这个标签)。没有设置将独占一行.
浮动(float)细节：
1.左(右)浮动元素，尽量靠近父元素左(右)内边沿。
2.浮动元素尽量不去重叠交叉。
3.浮动元素尽可能高，当不会高于父元素顶内边沿。
<style type="text/css">
<!--
.a {
background-color: #000000;
float: left;
width: 241px;
}
.b {
background-color: #00FF00;
float: right;
width: 677px;
}
.c {
background-color: #CC0066;
float: left; //定义right靠右边对齐
width: 677px;
}
.t {
background-color: #3399CC;
width: 950px;
}
-->
</style>
</head>
<body>
<div class="t" id="t">
<div class="a" id="1" > <img alt="111111" height="52" /> </div>
<div class="b" id="2" ><img alt="222" /></div>
<div class="c" id="3" ><img alt="3333" /></div>
</div>
</body>
显示结果:
当定义一个外层 div t 时,里面的 div a/b/c 随指定的float值紧帖外层 div t 的左/右边显示
.
如果没有外 div t , 则紧帖BODY显示.
(缩小IE窗口只会裁剪内容)
****************************
当去掉div t ,则紧帖BODY(IE窗口)的左/右显示,当缩小IE窗口时出现不理想的缩进.显示如下:
*****************************
HTML网页的显示,是从上到下,从外到内的显示标签.如 img "111" 的高小于 img"222",则出现img "333"显示到前面.
显示结果:
posted on 2009-02-03 14:39
紫蝶∏飛揚↗ 阅读(3381)
评论(0) 编辑 收藏 所属分类:
CSS