-
上面的代码没有给main设置高度，而main里的内容又设置成了浮动，所以footer会跑到head的下面。 解决方法有两个：1.清除浮动， clear:both; 2.为main设置高度， .main{ width:860px;height:600px;margin:0 auto;background:#9FC; }查看全部
-
因为left和right都设置了绝对定位，脱离了文档流，所以main的margin值必须设置成 margin:0 310px 0 210px; 才能实现左右的间距查看全部
-
.top{width:100%;height=100px;background:#ccc;} .top{width:100%;height:100px;background:#ccc;}查看全部
-
<body> <div class="head">head</div> <div class="main">main</div> <div class="footer">footer</div> </body>查看全部
-
body{ margin:0; padding:0; font-size:30px; font-weight:bold} div{ text-align:center; line-height:50px;overflow:hidden;} .main{ width:700px; height:600px; margin:0 auto} .left{ width:190px; height:600px; margin-right:10px;background:#ccc; float:left;} .right{ width:500px; height:600px; background:#FCC; float:right;}查看全部
-
float 就是并排在一起使用的代码，并排的时候，需要在右边就float:right;需要在左边就是float:letf;查看全部
-
<style type="text/css"> .top{width:100%;background:#ccc;} .main{height:600px;background:red;position:relative}/*作为子元素绝对定位的参照系*/ .left{width:200px;height:600px;background:blue;position:absolute;}/*定位默认左上角*/ .right:{height:600px;background:green;position:absolute;left:210px;right:0;}/*紧贴右侧，宽度未定可自适应，为避免被left覆盖，设定距离左侧210px，和left保留10px的间隙* .foot{width:100%;height:50px;background:pink;} </style>查看全部
-
由于main设置成了浮动类型，所以footer会跑到head下面，所以需要clear:both;清除浮动查看全部
-
三列并排，采用固定宽度的格式进行分配时 左边列用position：absolute进行定位。左边left:0;top:0; 中间列设置margin：0 左列宽度 0 右列宽度; 右边列用position：absolute进行定位。右边right:0;top:0;查看全部
-
float和position:absolute两个CSS设置可以让元素脱离文档流查看全部
-
右侧先加载，左侧后加载 代码要求兼容ie6 宽度自适应width:100%查看全部
-
混合布局：嵌套 快挨着、嵌套、叠压查看全部
-
自适应宽度，高度 头部、主体、底部 主体：分栏（分列），混合布局 如何通过技术手段来完成布局查看全部
-
<style type="text/css"> .top{width:100%;background:#ccc;} .main{height:600px;background:red;position:relative}/*作为子元素绝对定位的参照系*/ .left{width:200px;height:600px;background:blue;position:absolute;}/*定位默认左上角*/ .right:{height:600px;background:green;position:absolute;left:210px;right:0;}/*紧贴右侧，宽度未定可自适应，为避免被left覆盖，设定距离左侧210px，和left保留10px的间隙* .foot{width:100%;height:50px;background:pink;} </style>查看全部
-
上面的代码没有给main设置高度，而main里的内容又设置成了浮动，所以footer会跑到head的下面。 解决方法有两个： 1.清除浮动， clear:both; 2.为main设置高度， .main{ width:860px;height:600px;margin:0 auto;background:#9FC; }查看全部
举报
0/150
提交
取消