課程
/前端開發
/HTML/CSS
/如何用CSS進行網頁布局
求解，不知哪里錯了，頂部文本不見了，謝謝！
2018-09-16
源自：如何用CSS進行網頁布局 5-3
正在回答
body{?margin:0;?padding:0;?font-size:30px;?color:#fff}.top{width:?100%;?height:100px;?margin:?0?auto;?background:?#ccc;}.main{position:relative;width:?100%;?height:600px;?margin:?0?auto;?background:?#ff0000;}.left{?position:absolute;?top:?0;?left:0;?width:200px;?background:?blue;?height:600px;}.right{float:left;?width:100%;?margin-left:200px;?height:600px;?background:?green;}.foot{width:?100%;?height:100px;?margin:?0?auto;background:orange;}
您好，如此添加了頂部高度，還是老樣子，是添加的位置錯了，謝謝！
中間兩個塊的浮動把頭部覆蓋了，所以要限定浮動距離網頁上邊的位置（top的高度）
添加如下代碼：
.left ,.right{top:100px;}
江7856 提問者
舉報
用最簡潔的案例教你布局的那些知識，這是前端工程師基本技能
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2019-10-12
body{?margin:0;?padding:0;?font-size:30px;?color:#fff}.top{width:?100%;?height:100px;?margin:?0?auto;?background:?#ccc;}.main{position:relative;width:?100%;?height:600px;?margin:?0?auto;?background:?#ff0000;}.left{?position:absolute;?top:?0;?left:0;?width:200px;?background:?blue;?height:600px;}.right{float:left;?width:100%;?margin-left:200px;?height:600px;?background:?green;}.foot{width:?100%;?height:100px;?margin:?0?auto;background:orange;}2018-09-17
您好，如此添加了頂部高度，還是老樣子，是添加的位置錯了，謝謝！
2018-09-16
中間兩個塊的浮動把頭部覆蓋了，所以要限定浮動距離網頁上邊的位置（top的高度）
添加如下代碼：
.left ,.right{top:100px;}