-
左側寬度為200px,右側寬度自適應： .left{width:200px;height:500px;position:absolute;top:100px;left:0;background:blue;} .right{height:500px;margin-left:210px;background:#9c9;}查看全部
-
完成頂部（top）、底部（foot）寬度自適應 .top{width:100%} .foot{width:100%}查看全部
-
清除浮動 clear:both;查看全部
-
讓元素脫離文檔流：浮動（float）和 絕對定位（position：absolute）查看全部
-
網頁布局分為：一列布局，兩列布局，三列布局，使用的最多的是混合布局。查看全部
-
margin后面如果只有兩個參數的話，第一個表示top和bottom，第二個表示left和right 因為0 auto，表示上下邊界為0，左右則根據寬度自適應相同值（即居中）查看全部
-
position:absolute查看全部
-
float&&position：absolute查看全部
-
clear:both查看全部
-
用position的relative和absolute來定位就可以了！查看全部
-
body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ text-align:center; line-height:50px} .top{ height:100px;background:#9CF} .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} div{ text-align:center; font-weight:bold} .main,.footer{ width:960px;margin:0 auto;} .head{ width:100%; height:100px; background:#ccc} .main{ height:600px; background:#FCC;} .footer{ height:50px; background:#9CF}查看全部
-
body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ text-align:center; line-height:50px} .main{ width:960px; height:600px; margin:0 auto} .left{ width:300px; height:600px; background:#ccc; float:left;}/*左浮動樣式*/ .right{ width:560px; height:600px; background:#FCC; float:right;}/*右浮動樣式*/查看全部
-
body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ line-height:50px} .left{ width:200px; height:600px; background:#ccc; position:absolute; left:0; top:0} .main{ height:600px; margin:0px 300px 0px 200px; background:#9CF} .right{ height:600px; width:300px; position:absolute; top:0; right:0; background:#FCC;}查看全部
-
.main margin:0 auto 水平居中查看全部
舉報
0/150
提交
取消