-
這一節講的很直觀，絕對定位的使用和margin值得搭配，看起來比浮動更加的容易操控。查看全部
-
body{margin: 0;padding:0; } 清除默認樣式查看全部
-
.left{ width:200px; height:600px; background:#ccc; position:absolute; left:0; top:0} .main{ height:600px; margin:0 310px 0 210px; background:#9CF} .right{ height:600px; width:300px; position:absolute; top:0; right:0; background:#FCC;}查看全部
-
position:absolute查看全部
-
clear:both; //清楚浮動 總結： 單列布局用margin: 0 auto; 兩列布局用：float: left & float: right; 三列布局用： position: absolute; top:0; left:0px; right: 0px; margin-left:XXX; 混合布局： clear:both; position: relative;查看全部
-
position:abolute; margin: 0 300px 0 200px; top: 0; left: 0; top: 0 right:0;查看全部
-
可以讓元素脫離文檔流: float && position: absolute查看全部
-
單列布局：一般都于文字少的，如百度首頁。 margin: 0 auto; //水平居中 body { margin:0px; padding:0px; }//清楚Body的默認值查看全部
-
.top{height:60px;background:#ccc;} .main{height:400px;background:red;} .left{height:400px;width:200px;background:blue;left:0;top:60px;position:absolute;} .right{height:400px;margin-left:210px;background:green;} .foot{height:60px;background:orange;}查看全部
-
三種狀態，塊挨著塊，塊嵌套著塊，塊疊壓著塊查看全部
-
自適應查看全部
-
body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ text-align:center; line-height:50px} .top{ height:100px;background:#6CF} .head,.main{ width:960px;margin:0 auto;} .head{ height:100px; background:#F90;} .left{ width:220px; height:600px; background:#ccc;float:left;} .right{ width:740px; height:600px;background:#FCC; float:right} .r_sub_left{ width:540px; height:600px; background:#9C3; float:left} .r_sub_right{ width:200px; height:600px; background:#9FC;float:right;} .footer{ height:50px; background:#9F9;clear:both;}查看全部
-
文檔流：將窗口自上而下分成一行一行，并在每行中按從左至右的依次排放元素，即為文檔流。 有三種情況使得元素離開文檔流而存在，分別是浮動 絕對布局 固定定位查看全部
-
body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ line-height:50px} .left{ width:200px; height:600px; background:#ccc;left:0 top:0;position:absolute;} .main{height:600px;margin:0 310px 0 210px;background:#9CF} .right{ height:600px;width:300px; position:absolute;top:0;right:0;background:#FCC;}查看全部
-
居中： margin：0 auto 不設寬度，就是屏幕自適應寬度查看全部
舉報
0/150
提交
取消