成人精品一区二区三区中文字幕-成人精品一区二区三区-成人精品一级毛片-成人精品亚洲-日本在线视频一区二区-日本在线视频免费

今天寫了一段CSS,寫時突然想到的,寫出來和大家分享一下; 我們可能早已習慣了padding在不同瀏覽器中的不同之處, 但這個你不一定注意過;

先說一個場景,例如:
一個寬400px的黃盒子,左邊放一個300px的小藍盒子,右邊放一個寬100px的紅盒子.這樣應該正好放下對吧? 因為300+100正好是400呀! 好了,先試一試!
我開始寫了(頭部省略):

<style>  
#yellow{ width:400px; border:1px solid #FF9900; background:#FFCC99; float:left;}  
#blue{ width:300px; height:100px; border:1px solid #0066FF; background:#00CCFF; float:left;}  
#red{ width:100px; height:100px; border:1px solid #FF3300; background:#FF9900; float:right;}  
</style>  

400px  
<div id="yellow">  
 <div id="blue">300px</div>  
 <div id="red">100px</div>  
</div> 

看一下效果:
www.zishu.cn 400px 300px 100px
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
最后的效果是這樣的:




沒有放下,原因就是因為我寫了一個border:1px; 那我們把他去掉看一下.
www.zishu.cn 400px 300px 100px
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]