-
清楚浮動有兩種方法： clear:both; //清除兩邊元素的浮動對他的影響 overflow: hidden; // 用在浮動元素本身清除對父元素的影響查看全部
-
文檔流：將窗口自上而下分成一行一行，并在每行中按從左至右的依次排放元素，即為文檔流。 有三種情況使得元素離開文檔流而存在，分別是浮動 絕對布局 固定定位查看全部
-
2列自適應，用百分比來確定高和寬~~查看全部
-
網頁設計特點查看全部
-
浮動float left right width 20% 80%查看全部
-
清除浮動有兩種方法：1.clear:both 2.overflow:hidden查看全部
-
清除浮動有兩種方法：1.clear:both 2.overflow:hidden查看全部
-
清除浮動有兩種方法：1.clear:both 2.overflow:hidden(常見為隱藏溢出的功能)查看全部
-
<title>混合布局</title> <style><br> body{ margin:0; padding:0; font-size:30px; font-weight:bold}<br> div{ text-align:center; line-height:50px}<br> .top{ height:100px;background:#9CF}<br> .head,.main{ width:960px; margin:0 auto;}<br> .head{ height:100px; background:#F90}<br> .left{ width:220px; height:600px; background:#ccc; float:left;}<br> .right{ width:740px; height:600px;background:#FCC; float:right}<br> .r_sub_left{ width:540px; height:600px; background:#9C3; float:left}<br> .r_sub_right{ width:200px; height:600px; background:#9FC; float:right;}<br> .footer{ height:50px; background:#9F9; clear:both }<br> </style> </head> <body><br> <div class="top"><br> <div class="head">head</div><br> </div><br> <div class="main"><br> <div class="left">left</div><br> <div class="right"><br> <div class="r_sub_left">sub_left<br> </div><br> <div class=" r_sub_right">sub_right<br> </div><br> </div><br> </div><br> <div class="footer">footer</div><br> </body>查看全部
-
常見布局查看全部
-
<!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} 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} </style> </head> <body> <div class="head">head</div> <div class="main">main</div> <div class="footer">footer</div> </body> </html>查看全部
-
margin:0 auto;定寬塊狀元素水平居中對齊，margin左右為auto查看全部
-
三列布局：中間可以不給寬度樣式，來個左右邊距，寬度便會根據父級的寬度變化而變化。（w = 父親w - 左右外邊距）;查看全部
-
<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; font-weight:bold} div{ line-height:50px} .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;} </style> </head>查看全部
-
著作權歸作者所有。 商業轉載請聯系作者獲得授權，非商業轉載請注明出處。 作者：張秋怡 鏈接：https://www.zhihu.com/question/24529373/answer/29135021 來源：知乎 脫離文檔流，也就是將元素從普通的布局排版中拿走，其他盒子在定位的時候，會當做脫離文檔流的元素不存在而進行定位。需要注意的是，使用float脫離文檔流時，其他盒子會無視這個元素，但其他盒子內的文本依然會為這個元素讓出位置，環繞在周圍。而對于使用absolute positioning脫離文檔流的元素，其他盒子與其他盒子內的文本都會無視它。查看全部
舉報
0/150
提交
取消