CSS中設置兩個div浮動是常見的布局方式,可以實現多欄布局的效果,下面我們簡單介紹一下如何使用CSS設置兩個div浮動。
首先,在HTML中創建兩個div,我們用div1和div2來表示:
<div id="div1"> <p>這是div1</p> </div> <div id="div2"> <p>這是div2</p> </div>
然后,在CSS中設置兩個div浮動,可以使用float屬性來實現:
#div1 { float: left; /* div1浮動在左側 */ width: 200px; /* 設置div1寬度為200像素 */ background-color: #ccc; /* 設置div1背景顏色為灰色 */ } #div2 { float: right; /* div2浮動在右側 */ width: 200px; /* 設置div2寬度為200像素 */ background-color: #eee; /* 設置div2背景顏色為淡灰色 */ }
通過設置兩個div浮動,我們就可以實現左右兩欄布局的效果了。