-
margin:0 auto 定宽元素水平居中 不定宽元素似乎使用margin:auto 0居中不了？查看全部
-
网页可以自适应宽度，网页的长度理论上没有限制。查看全部
-
什么叫布局？ 又称版式布局，是网页UI设计师将有限的视觉元素进行有机的排列组合。查看全部
-
利用两边为绝对定位，做一个中间栏为自适应的三栏布局查看全部
-
左边设置绝对定位，右边设置绝对定位，中间自适应查看全部
-
混合布局就是在原基础里面添加布局查看全部
-
clear：both； 清除浮动查看全部
-
三列布局左右固定宽度用绝对定位position：absolute；left：0； top：0；，中间自适应的方法.左右设置绝对定位，中间居中。如果用浮动不会自适应查看全部
-
.left{ width:200px;height:500px;position:absolute;left:0;top:100px;background:blue;} .right{background:#9C9;height:500px;margin-left:210px;} .left{width:30%; height:500px; background-color:#00a;float:left;} .right{width:60%; height:500px; background-color:#9C9;float:right;}查看全部
-
.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;}查看全部
-
.left{width: 20%; height: 500px; background: red; float: left;} .right{width: 80%; height: 500px; background: blue; float: right;}查看全部
-
<!DOCTYPE html> <html> <head> <meta charset=utf-8" /> <title>混合布局</title> <style> body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ text-align:center; line-height:50px} .top{ height:100px;background:#9CF} .head,.main{ width:960px; margin:0 auto;overflow:hidden;} .head{ height:100px; background:#F90} .left{ width:220px; height:600px; background:#ccc;float:left;} .right{ width:740px; height:600px;background:#FCC; float:right} .r_sub_left{ width:540px; height:600px; background:#9C3; float:left} .r_sub_right{ width:200px; height:600px; background:#9FC; float:right;} .footer{ height:50px; background:#9F9;} //清除浮动 clear:both; </style> </head> <body> <div class="top"> <div class="head">head</div> </div> <div class="main"> <div class="left">left</div> <div class="right"> <div class="r_sub_left">sub_left </div> <div class=" r_sub_right">sub_right </div> </div> </div> <div class="footer">footer</div> </body> </html>查看全部
-
对于我们设置的外围容器也就是上面的.main一般不需要设置高度，上面的代码是对的，因为外围的高度最好是由里面的内容撑起来，避免出错。 在上面浮动对两个元素造成了影响，一个就是.main（父容器），由于里面的元素是浮动的脱离了文档流，所以没有撑开；第二个就是下面的.footer元素，由于之前说的main没有撑开，所以.footer 到了.header元素下面（替代浮动元素在正常文档流中的位置）。 所以需要清除浮动，一般用两种方法1，在.main{ }添加overflow:hidden 2.在.footer{}里面添加clear:both; footer没颜色或跑位原因：main没有被里面的元素撑开。 解决办法：1.给main使用隐藏溢出overflow:hidden;让main撑开。 2.给受影响元素清除浮动clear:both;去除影响。 推荐用办法1.查看全部
-
文档流：将窗口自上而下分成一行一行，并在每行中按从左至右的依次排放元素，即为文档流。 浮动（float），绝对定位（position:absolute）和固定定位（position：fixed）可让元素脱离文档流，即元素移位后不占原区域； 相对定位（position:relative）不能脱离。查看全部
-
<style type="text/css"> body{ margin:0; padding:0; font-size:30px; color:#fff} .top{width:100%; height:100px;background:gray;} .main{background:red;height:300px;} .left{ float:left; background:blue; width:200px; height:300px;position:absolute; } .right{ background:green;margin-left:210px; height:300px;position:absolute;width:100%;} .foot{background:orange;width:100%;} </style>查看全部
举报
0/150
提交
取消