課程
/前端開發
/HTML/CSS
/如何用CSS進行網頁布局
我在父盒子中設置了margin:0 auto;右邊的盒子沒有設置寬,為什么不能自適應。縮小瀏覽器窗口后,瀏覽器下面出現滾動條。
2016-06-27
源自:如何用CSS進行網頁布局 5-3
正在回答
main不要設置寬度,否則right確實是自適應了,但適應的是main的寬度除去left寬度之后的寬度
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html?xmlns="http://www.w3.org/1999/xhtml"> <head> <meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/> <title>混合布局編程挑戰</title> <style?type="text/css"> body{?margin:0;?padding:0;?font-size:30px;?color:#fff} .top{height:100px;background:#CCC;} .main{height:600px;background:red;} .left{width:200px;height:600px;background:blue;position:absolute;left:0;top:100px;} .right{height:600px;background:?#9acc99;margin-left:210px;} .foot{height:100px;background:#FF6634;clear:both;} </style> </head> <body> <div?class="top">top</div> <div?class="main"> ????<div?class="right">right中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文</div> ????<div?class="left"></div> </div> <div?class="foot">foot</div> </body> </html>
你參考下我的。。
main的寬度設置的太大了 ?寬度自適應設width為100%??margin 是調整位置的
舉報
用最簡潔的案例教你布局的那些知識,這是前端工程師基本技能
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-06-30
main不要設置寬度,否則right確實是自適應了,但適應的是main的寬度除去left寬度之后的寬度
2016-06-29
你參考下我的。。
2016-06-27
main的寬度設置的太大了 ?寬度自適應設width為100%??margin 是調整位置的