元素設置float屬性後,其後面的元素的位置問題
阿新 • • 發佈:2017-08-21
second margin cond pre javascrip log 屬性 idv wid
分兩種情況:
.content{ width:350px; height:150px; color:#fff; } .content1,.content2{ background-color: #00f; } .content2{ margin-top:10px; } .one{ background-color:#f00; float: left; } .two{ background-color: #3dfeca; } .content1 .one, .content2 .one{ height:50px; }
一,後面的元素是塊級元素---block
<div class=‘content content1‘> <div class=‘one‘> the folowing element is block; </div> <div class=‘two‘> second div idv idv div div div div div div div div </div> </div>
二,後面的元素是行內元素--inline
1 <div class=‘content content2‘> 2 <div class=‘one‘> 3 the folowing element is inline; 4 </div> 5 <span class=‘two‘> 6 inline element is span;there is other inline element such as a,i,b,em 7 </span> 8 </div>
元素設置float屬性後,其後面的元素的位置問題