-
浮動（float）和絕對定位（position:abdsolute）：讓元素脫離文檔流。查看全部
-
三列布局，兩邊固定寬度，中間自適應查看全部
-
main沒有設置高度，而他的里面元素又有浮動，所以main是一直往下拓展，所以footer會在他下面，為了顯示出footer的顏色，需要清除他的浮動，cler:both查看全部
-
清除浮動兩種方法：1. clear:both; 2. overflow:hidden.查看全部
-
bjq查看全部
-
三列布局中間自適應 左右絕對定位，中間設置左右margin，分別為左右的寬度，則可以自適應查看全部
-
一列布局：設置<div class="main">; body清零｛margin:0;padding:0｝;. main設置寬 ,高,背景色,垂直居中，｛width:800px;height:300px;background:#ccc;margin:0 auto;｝ ?div class=top/foot, 設置.top{height:100px;background:blue}, 設置.foot{width:800px;height:100px;background:#900;merging:o auto;}查看全部
-
右側哪兩個 css 設置，可以讓元素脫離文檔流（） A浮動（float）和 絕對定位（position：absolute）查看全部
-
多列布局，如果各有寬度，可以用float屬性，footer要clear：both 如果有一邊無寬度自適應，float會出錯 有寬度的要使用position：absolute; 父元素框架使用position: relative; 自適應寬度的要使用margin-left:200px 可以順利布局查看全部
-
<!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; color:#fff} .top{height:100px;background:#ccc;} .main{position:relative;} .left{position:absolute;left:0;top:0;width:200px;height:500px;background:blue;} .right{margin-left:200px;height:500px;background:#9c9;} .foot{height:50px;background:#F63;} </style> </head> <body> <div class="top">top</div> <div class="main"> <div class="right">right</div> <div class="left">left</div> </div> <div class="foot">foot</div> </body> </html>查看全部
-
<html><br> <head><br> <title>布局</title><br> <style type="text/css"><br> body{margin:0; padding: 0}<br> .top{<br> width: 800px;<br> height: 100px;<br> background: #645;<br> margin:0 auto;<br> }<br> <br> <br> .main{<br> width: 800px;<br> height: 300px;<br> background: #ccc;<br> margin: 0 auto;<br> }<br> <br> .bottom{<br> width: 800px;<br> height: 100px;<br> background: #973;<br> margin:0 auto;<br> }<br> <br> <br> </style><br> </head><br> <body><br> <div class="top"> </div><br> <div class="main"> </div><br> <div class="bottom"> </div><br> </body><br> </html>查看全部
-
<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 10px 0 10px; background:#9CF} .right{ height:600px; width:300px; position:absolute; top:0; right:0; background:#FCC;} </style> /*使用absolute絕對定位*/查看全部
-
.清除浮動， clear:both查看全部
-
position絕對定位 三欄布局 中間（margin）查看全部
-
混合布局查看全部
舉報
0/150
提交
取消