DIV+CSS布局问题，我们想让两个DIV标签并排，第2个为什么老跑第一个下去

html-css012

DIV+CSS布局问题，我们想让两个DIV标签并排，第2个为什么老跑第一个下去,第1张

给div加浮动float属性就可以了，左浮动（float：left）或者右浮动（float：right）都无所谓只有宽度不超过他们的父元素的宽度就ok，最后加上一个clear属性来清除浮动，防止下面的元素发生错位现象。

把下边代码贴到网页的body里面

<style>

div{ border:1px solid #000}

.div{ width:300pxheight:200px}

.div1{ float:leftwidth:100pxheight:100px}

.div2{ float:rightwidth:100pxheight:100px}

.clear{ clear:both}

</style>

<div class="div">

<div class="div1">第一个</div>

<div class="div2">第二个</div>

<div class="clear"></div>

</div>

html元素有几个是块级元素如p,h1-h6等，这些元素自带display block属性，元素间相当于会有一个换行符不能同排排列，除非定义浮动。而img是内联块元素也就是display inline-bloack，可以并排显示的。 两个元素一个加了浮动一个没加浮动，只会是浮动的优先排列在左或者右，也就是没有浮动的元素会被有浮动的拆队。除非2个元素都是浮动的他们才会老老实实的按顺序排在一起。浮动不是覆盖只是位置的先后罢了，便于将不同类型的元素并排。css里没有覆盖之说。你写的例子最终效果就是b图排在a图左边而已。