久草久久叉揉久久久,北岛玲精品一区二区三区,综合一区二区三区激情

首頁免費課如何用CSS進行網頁布局問答

如何用CSS進行網頁布局

全部評論問答未解決精華

小樽

做邊框用絕對定位

0 5-3 編程挑戰

2020-06-13

慕函數6239838

.top{height:200px;background:gray;}
.main{height:500px;background:red;width:100%;}
.left{ width:200px;height:500px;background:blue;position:absolute; left:0;}
.right{background:green;height:500px;position:absolute;margin-left:210px;width:100%;}
.foot{height:100px;background:orange;}

0 5-3 編程挑戰

2020-06-01

不想游泳的鯨魚

*{
padding: 0;
margin: 0;
text-align: center;
}
.top,.foot{
height: 50px;
line-height: 50px;
background-color: cadetblue;
}
.left,.right{
height: 500px;
}
.right{
background-color: blueviolet;
}

.left{
width: 200px;
position: absolute;
top: 50px;
background-color: #FF7F50;
}

0 5-3 編程挑戰

2020-04-01

有彩虹

自適應不是只有百分比的時候才可以嗎

0 4-1 三列布局

2020-03-28

慕函數1487353

他們設置 310 和210 是為了讓效果圖和案例一樣，中間div和兩邊有空白的間距。由于中間的div設置的margin 所以，它的距離是相對于body的距離，你疑問為啥不是和左右兩個div的距離，是因為，左右兩個div由于設置了absolute 脫離了文檔流，也就是相當于相對其他div來說，它類似于透明的空氣一般。

0 4-3 編程練習

2020-03-15

奔云石

.top{background:#ccc;}
.main{background:red; height:600px;}
.left{ width:30%;height:100%; float:left; background:blue;}
.right{width:60%;height:100%; float:right;background:black;}
.foot{background:orange;}

0 5-3 編程挑戰

2020-03-01

hello七里

測試ok的

.main{height:400px;background:red;position:relative;}
.left{ width:200px;height:400px;background:blue; position:absolute;left:0;top:0;}
.right{height:400px;background:lightgreen;margin-left:210px;}

0 5-3 編程挑戰

2020-02-21

乖巧的女孩

請問一下padding這個的翻譯是？

0 3-1 二列布局

2020-02-18

蒼穹下的奔跑1991

汲取知識！

0 3-1 二列布局

2020-02-16

qq_迷失的無聊

剛剛寫的那個有問題，感覺css很難學啊 .top{background:#ccc;height:50px;} .main{height:500px;background:#ff0000;position:relative;} .left{height:500px;width:200px;background:#0000FF;position:absolute;left:0px;top:0px;} .right{height:500px;margin-left:210px;background:#66CDAA;} .foot{background:#FF7256;height:50px;}

0 5-3 編程挑戰

2019-11-25

qq_迷失的無聊

分享一下

.top{background:#ccc;height:50px;}
.main{height:500px;background:#ff0000;position:relative;}
.left{height:500px;width:200px;background:#0000FF;float:left;}
.right{height:500px;position:absolute;left:210px;background:#66CDAA;width:100%;}
.foot{background:#FF7256;height:50px;}

0 5-3 編程挑戰

2019-11-25

Java攀登者

body{ margin:0; padding:0; font-size:30px; background-color:red}
.top{height:100px; background:#ccc}
.left{ width:200px; height:500px; background:blue;position:absolute;top:100px;left: 0; }
.right{ margin-left:210px;height:500px; background:#9C9;}
.foot{ height:100px;background:#F63;clear:both;}

0 5-3 編程挑戰

2019-10-28

超級小仙女

head{ width:100%; height:100px; background:#ccc}
.main{ height:600px; background:#FCC;margin:0 auto;}
.footer{ height:50px; background:#9CF;margin:0 auto;}

0 2-3 編程練習

2019-10-12

慕工程2275325

非常感謝！

0 5-3 編程挑戰

2019-10-05

qq_路維希_0

只貼關鍵部分代碼吧：
.main{background-color:red;height:600px;}
.left{width:200px;height:600px;background-color:blue;float:left;}
.right{height:600px;background-color:green;float:right;width:calc(100% - 210px);}
.foot{clear:both;heigth:100px;background-color:orange;}

0 5-3 編程挑戰

2019-09-25

首頁上一頁1 2 3 4 5 6 7 下一頁尾頁

該課程已下架

課程須知: 1.你需要掌握html+css樣式基礎知識 2.有一定的前端實際開發經驗

老師告訴你能學到什么？: 1.掌握網頁布局的相關知識 2.能對不同的網頁進行布局結構劃分 3.掌握固定寬度和自適應寬度的實現方法

微信掃碼，參與3人拼團

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何用CSS進行網頁布局