HTML如何让两个div并排在一行,如何实现两个或多个div并列于一行

div是块状元素，默认是独占据一行。

但是，如何让两个或多个块区域并列于一行？

块状元素有一个很重要的“float”属性，可以达成这种效果。float 属性也被称为浮动属性，这个词非常形象。

对前面的div元素设置浮动属性后，当前面的div元素留有足够的空白宽度时，后面的div元素将自动浮上来，和前面的div元素并列于一行。

float 属性的值有 left、right、none 和 inherit。float 属性值为 none 时，块状元素不会浮动。

设置 div 浮动

* {

margin: 0px;

padding: 0px;

}

#one {

width: 125px;

height: 120px;

background-color: #eee;

border: 1px solid #000;

float: left;

}

#two {

width: 200px;

height: 120px;

background-color: #eee;

border: 1px solid #000;

}

第1个div

第2个div

效果图

但是要注意：要是2个div并列于一行的前提是这一行有足够的宽度容纳2个div的宽度。