-
margin:0 auto (div屬性，居中)查看全部
-
margin:0 auto (div屬性，居中)查看全部
-
網頁布局特點：網頁可以自適應寬度以及網頁的長度理論上沒有限制查看全部
-
值得看：中間自適應，左右固定寬度的三列布局！查看全部
-
三列布局：left:絕對定位 position：absolute；left：0；top;0； right 同理 middle margin:0;left: right:查看全部
-
<!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{width:800px;height:100px;margin:0 auto;background:#ccc;} .main{width:800px;height:600px;margin:0 auto;background:red;} .left{ width:300px;height:600px;float:left;background:blue;} .right{ width:490px;height:600px;float:right;background:#9C9;} .foot{width:800px;height:50px;margin:0 auto;background:#F63;clear:both;} </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>查看全部
-
float 屬性定義元素在哪個方向浮動。以往這個屬性總應用于圖像，使文本圍繞在圖像周圍，不過在 CSS 中，任何元素都可以浮動。浮動元素會生成一個塊級框，而不論它本身是何種元素。 如果浮動非替換元素，則要指定一個明確的寬度；否則，它們會盡可能地窄。 注釋：假如在一行之上只有極少的空間可供浮動元素，那么這個元素會跳至下一行，這個過程會持續到某一行擁有足夠的空間為止。 替換元素： 替換元素是瀏覽器根據其標簽的元素與屬性來判斷顯示具體的內容。 比如：<input /> type="text" 的是，這是一個文本輸入框，換一個其他的時候，瀏覽器顯示就不一樣 (X)HTML中的<img>、<input>、<textarea>、<select>、<object>都是替換元素，這些元素都沒有實際的內容。 非替換元素： (X)HTML 的大多數元素是不可替換元素，他們將內容直接告訴瀏覽器，將其顯示出來。 比如<p>wanmei.com</p> 瀏覽器將把這段內容直接顯示出來。 除了這兩字，還有兩種非常屬性的元素，顯示元素，他分為兩種情況，一種是‘塊及元素’ ‘block’，還有一種是“行內元素”inline，大家也叫“內聯元素”。 塊及元素 他最明顯的特征就是獨自占領一行，自動充滿父級元素的內容區域，絕不會讓別人“侵略”（當然可以通過其他方式去改變他）。 常見的有：div，p..等等。 通過CSS設定了浮動（float屬性，可向左浮動或向右浮動）以及設定顯示（display）屬性為“block”或“list-item”的元素都是塊級元素。這個地方浮動是一個比較特殊的情況，可以詳查浮動這個知識 行內元素： 上面說塊及元素獨自占領一行，行內元素就沒這么霸道了，他可以左右都允許有元素，最常見的就是<a></a>查看全部
-
寬度的百分數配上浮動查看全部
-
定位的方法就是把塊狀元素定位到絕對位置，無論瀏覽器怎么動都不會把位置弄亂查看全部
-
當被float元素遮蓋的元素有 css style（overflow:hidden 即文本不溢出，文本不能顯示在元素外）時，元素不再被float元素遮蓋。查看全部
-
float:脫離文檔流，遮蓋下層的元素，但并不遮元素的內容。內容會環繞它。 這就是為什么被遮蓋元素中的內容比如文本會溢出。 clear屬性是指元素在做浮動的時候左/右/兩邊 不能出現浮動的元素，是一個動態而不是靜態的概念。舉個例子div1(float:left;clear:right) div2(float:left）從字面上看，div2不會浮動到div1右邊，因為div1的右邊不允許出現浮動元素嘛。其實不是這樣的。clear屬性只在本元素做浮動的時候生效，也就是說div2在浮動的時候因為沒有clear屬性，所以能正常向左浮動，緊貼在div1左邊查看全部
-
<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{background:gray; width:80%; margin:0 auto;} .main{background:red; width:80%; position:relative; margin: 0 auto;} .right{background:green; height:300px; margin-left:210px;} .left{background:blue; width:200px; height:300px; position:absolute; top:0; left:0; } .foot{background:yellow; width:80%; margin:0 auto;} </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>查看全部
-
.top{ width:500px; height:100px; background:#ddd; margin:0 auto; } .main{ margin:0 auto; width:500px; height:600px; background:red; } .left{ width:150px; height:600px; float:left; background:blue; } .right{ width:340px; height:600px; float:right; background:lightgreen; } .foot{ margin:0 auto; width:500px; height:100px; background:orange; }查看全部
-
css中的浮動(float)和絕對定位(position:absolute)的設置可以讓元素脫離文檔流。查看全部
-
Div{width:800px;height:500px;margin:0 auto;}這個代碼中的margin:0 auto;可以實現定寬元素居中的方法。查看全部
舉報
0/150
提交
取消