-
.left{width:200px;height:900px;background:blue;float:left;position:absolute;clear:both;}/*可以試試不用float。*/ .left{ width:200px;height:500px;position:absolute;left:0;top:100px;background:blue;}查看全部
-
.top{height:300px;background-color:#ccc;}/*可以省略-color。。*/查看全部
-
試一試效果查看全部
-
水平居中： margin：0 auto; 清除浮動： clear：both;查看全部
-
左側和右側寬度固定，中間自適應，并且三個水平，用float不能實現 使用絕對定位： 在左側樣式：absolute：left 0;top:0; 在右側樣式：absolute ：right 0;top 0; 中間樣式：不設置width的值，并且margin：0 300px 0 200px;查看全部
-
頁面間元素的關系(塊與塊之間的關系)： 塊挨著塊 塊嵌套著塊 塊壓著塊 通過css樣式讓頁面更完美。查看全部
-
三列布局 使left部分絕對定位 使main水平居中在瀏覽器中央，并且與左右div有10px的間距 使right定位在右側查看全部
-
浮動后面的元素如果不清楚浮動 就會當前面的元素不存在而占用其位置. 本例中main未設置高度,footer未清除浮動其css效果就會占用main位置 清除浮動方式： clear:both overflow:hidden查看全部
-
網頁布局：又稱版式布局，是網頁UI設計師將有限的視覺元素進行有機的排列組合，將理性的思維個性的化的表現出來，是一種具有個人藝術特色的視覺傳達方式。傳達信息的同時有美感。 網頁設計特點（相對紙媒來說） 1、網頁可以自適應寬度 2、網頁的長度理論上可以無限延長 一般是頭部，主體，底部。主體一般再根據需要分欄，一般兩欄或者三欄，還有可能分為更多的欄目。常見分欄方式：一、二、三、列布局，混合布局。查看全部
-
用position：absolute；不用float浮動；查看全部
-
《如何用CSS進行網頁布局》觀看時間：2015-07-24.Friday.11:24-11:50查看全部
-
特殊三列 左為固定寬度，中間為自適應，右邊為固定寬度 左右列固定寬度，中間列自適應。 左側絕對定位：position：absolute;left:0;top:0; 右側絕對定位：position：absolute;right:0;top:0; 中間寬度定義去掉，定義為auto，加上左右的margin值，margin:0 310px 0 210px; 上右下左（中間空一點出的話，增加margin屬性值便可以實現） 左右兩側布局固定寬度，中間部分寬度自適應。則需要采用絕對定位來實現，把左右設置為絕對定位查看全部
-
<!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; font-weight:bold} div{ line-height:50px} .left{ width:200px; height:600px; background:#ccc; position:absolute; left:0; top:0} .main{ width:0 auto;height:600px; margin:0px 310px 0px 210px; background:#9CF} .right{ height:600px; width:300px; position:absolute; top:0; right:0; background:#FCC;} </style> </head> <body> <div class="left">left</div> <div class="main">設計首頁的第一步是設計版面布局。就象傳統的報刊雜志編輯一樣，我們將網頁看作一張報紙，一本雜志來進行排版布局。 雖然動態網頁技術的發展使得我們開始趨向于學習場景編劇，但是固定的網頁版面設計基礎依然是必須學習和掌握的。它們的基本原理是共通的，你可以領會要點，舉一反三。</div> <div class="right">right</div> </body> </html>查看全部
-
坑人吧，仔細一看左右居然和父級寬度一樣了！所以就改了一下，哈哈查看全部
-
我就不信它不行查看全部
舉報
0/150
提交
取消