DIV+CSS如何做不规则定位,float区块怎么向上移动?

html-css018

DIV+CSS如何做不规则定位,float区块怎么向上移动?,第1张

直接设置下float的样式为左“漂移”就可以,之后即可根据窗口大小自动适应的。

<body >

<div class="one" style="float:leftwidth:40pxheight:50%">内容1</div>

<div class="two" style="float:leftwidth:40pxheight:50%">内容2</div>

</body >

首先明确一点就是,他们的确不是并列关系,float确实让第二个div飘起来了,而且占据了第一个div的位置。不信的话你可以给第二个div加一个背景颜色看看就会很清楚了。代码如下:

<div style="float:leftborder:1px solid">1</div>

<div style="border:1px solidbackground-color:#CCCCCC">2<div>

第二个div的位置的确是占据了第一个div的位置。第二个div的位置是从最左边开始的,也就是说它和第一个div的左边是重叠的。绝对不是和第一个div是并列关系。

两种方法。

一,设置两个div容器,将外面一个设置一下属性,text-align:center,再将里面一个设置以下属性margin:0 auto;这样可以兼容ie与ff的浏览器,不过缺点是所有内容由于设置了text-align:center所以将全部居中显示,可以额外设置属性解决,

二,设置一个div容器,为其设置一下属性:position:absolute;left:50%;margin-left:-你的容器宽度的一半,

记得最后一个属性设置你容器宽度的一半,并且为负数,这样将避开浏览器的兼容问题。