-
布局——版式布局。理性思維的表達； 不同的網站，功能不同，設計側重不同； 與紙質媒體對比： 網頁可以自適應寬度，按百分比計算 網頁的長度可以無限延長，高度也可以自適應 頭部、主體、底部——主體分欄 分欄：一二三列布局，混合布局 靈活運用浮動和定位查看全部
-
浮動float和絕對定位position：absolute 這2中形式可以讓元素脫離標準文檔流。查看全部
-
橫向2列布局，中間間隔10px查看全部
-
左右固定寬度，中間自適應 .left{ width:200px; height:400px position:absolute;left:0;top:0;} .middle{ height:400px margin:0 200px 0 300px;} .right{ width:300px; height:400px position:absolute;right:0;top:0;}查看全部
-
三列布局 body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ line-height:50px} .left{ width:200px; height:600px; background:#ccc; 【任務1】float:left; left:0; top:0} .main{ height:600px;margin:0 210px 0 310px; background:#9CF} .right{ height:600px; width:300px; position:absolute; top:0; 【任務3】float:right; background:#FCC;} </style>查看全部
-
//兩列布局float左右浮動 <style type="text/css"> 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; 【任務1】float:left;}/*左浮動樣式*/ .right{ width:660px; height:600px; background:#FCC; 【任務2】float:right;}/*右浮動樣式*/ </style>查看全部
-
水平居中 body{ margin:0; padding:0; font-size:30px} div{ text-align:center; font-weight:bold} .main,.footer{ width:960px; 【任務1】} .head{ width:100%; height:100px; background:#ccc} .main{ height:600px; background:#FCC；margin:0 auto;} .footer{ height:50px; background:#9CF;margin:0 auto;} </style> </head> <body> <div class="head">head</div> <div class="main">main</div> <div class="footer">footer</div> </body>查看全部
-
浮動float和絕對定位position：absolute 這2中形式可以讓元素脫離標準文檔流。查看全部
-
CSS布局筆記： 1.使用margin:0 auto；使得div居中; 2.使用float為left和right使得兩個div處于同一行； 3.使用百分比寬度實現寬度自適應，使用絕對值使得寬度固定； 4.使用position:absolute實現div絕對定位，在三列布局中使得最左和最右絕對定義，中間可自適應； 5.混合布局可使用嵌套的方式，在橫向header、main和footer，然后在main中使用兩列或三列布局。 6.寬度自適應，左側固定寬度右側自適應，父盒子position:relative;左側子盒子position:absolute;右側margin-left。查看全部
-
margin:0 auto;(居中對齊)查看全部
-
CSS布局筆記： 1.使用margin:0 auto；使得div居中; 2.使用float為left和right使得兩個div處于同一行； 3.使用百分比寬度實現寬度自適應，使用絕對值使得寬度固定； 4.使用position:absolute實現div絕對定位，在三列布局中使得最左和最右絕對定義，中間可自適應； 5.混合布局可使用嵌套的方式，在橫向header、main和footer，然后在main中使用兩列或三列布局。 6.寬度自適應，左側固定寬度右側自適應，父盒子position:relative;左側子盒子position:absolute;右側margin-left。查看全部
-
特殊的三列布局：左右固定，中間自適應情況，左右使用絕對定位來實現，中間用margin實現. 三列布局：左側和右側固定，中間自適應： 左側{position：absolute；left:0;top:0} 右側{position：absolute；top:0；right：0} 中間{margin-left:100px;margin-right:100px;}查看全部
-
CSS布局筆記： 1.使用margin:0 auto；使得div居中; 2.使用float為left和right使得兩個div處于同一行； 3.使用百分比寬度實現寬度自適應，使用絕對值使得寬度固定； 4.使用position:absolute實現div絕對定位，在三列布局中使得最左和最右絕對定義，中間可自適應； 5.混合布局可使用嵌套的方式，在橫向header、main和footer，然后在main中使用兩列或三列布局。 6.寬度自適應，左側固定寬度右側自適應，父盒子position:relative;左側子盒子position:absolute;右側margin-left。查看全部
-
1)border-collspse:collapse;折疊邊框~ 圓角：border-radius：10px；圓角的度數。 border：2px；邊框也變成圓角的了。 當元素的位置position：static靜態的時候，設置的偏移量對其沒有影響~fixed的時候，元素不會隨著網頁的移動而移動. 2)清除浮動時：I、clear:both; II、float:none float會對其之后的元素產生影響，用clear:both;清除浮動影響. foot使用clear:both可以清除緊挨著它的上面的浮動元素.查看全部
-
用立體的思維理解塊狀元素的布局 平列 嵌套 疊加查看全部
舉報
0/150
提交
取消