-
上例中的清除浮动是在foot层清除浮动，详情见16行 见下例是在foot层外对foot层有直接影响的外包容层，内部加一个空的div，见74行查看全部
-
这样才有间距查看全部
-
border-collspse:collapse;折叠边框~ 圆角：border-radius：10px；圆角的度数。 border：2px；边框也变成圆角的了。 当元素的位置position：static静态的时候，设置的偏移量对其没有影响~fixed的时候，元素不会随着网页的移动而移动~查看全部
-
.left{position:absolut; left:0; top:0} .main{margin:0 10px} .right{position:absolut; left:0; top:0}查看全部
-
1.三列布局 代码如下 <head> <style type="text/css"> body{margin:0;padding:0} .left{width:33.33%;height:500px;float:left;background:#ccc} .middle{width:33.33%;height:500px;float:left;background:#999} .right{width:33.33%;height:500px;float:right;background:#ddd} </style> </head> <body> <div class="left"></div> <div class="middle"></div> <div class="right"></div> </body> </html> 2.特殊的三列布局 如下代码 body{margin:0;padding:0} .left{width:200px;height:500px;background:#ccc;position:absolute;left:0;top:0} .middle{height:500px;background:#999;margin:0 300px 0 200px} .right{width:300px;height:500px;background:#ddd;position:absolute;right:0;top:0} </style> </head> <body> <div class="left">200px</div> <div class="middle"></div> <div class="right">300px</div> </body> </html>查看全部
-
清除浮动有两种方法：1.clear:both 2.overflow:hidden查看全部
-
常见布局查看全部
-
脱离文档流，也就是将元素从普通的布局排版中拿走，其他盒子在定位的时候，会当做脱离文档流的元素不存在而进行定位，需要注意的是，使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在周围。而对于使用absolute positoning脱离文档流的元素，其他盒子与其他盒子内的文本都会无视它。查看全部
-
一列布局：通常作为网页的首页。
<!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/> <title>布局</title> <style type="text/css"> body{margin:0;padding:0} .top{height:100px;background:blue} .main{width:800px;height:300px;background:#cc;margin:0 auto} .foot{width:800px;height:100px;background:#900} </style> </head> <body> <div class="top"></div> <div class="main"></div> <div class="foot"></div> </body> </html>查看全部 -
.top{width:100%;background:grey;height:100px;}
.main{height:300px;width:100%;float:left;overflow:hidden;background:red;}
.left{width:30%;height:300px;background:blue;float:left;position:absolute;left:0px;top:100px;}
.right{width:67%;height:100%;background:green;float:right;}
.foot{width:100%;height:70px;background:orange;clear:both;}
查看全部 -
<div>放在<body>结尾处需要清除浮动：clear: both
查看全部 -
top,main(left,right),footer,当left,right都设置了浮动到左边、右边，在设置footer时，应该清除浮动，否则footer的内容会跑到top下面，占据了main的位置。也即是，clear: both;
查看全部 -
<style type="text/css"> body{margin:0;padding:0} main{width:800px;matgin:0 auto} .left{width:220px;heigth:500px;float left;background #ccc} .right{width:580px;heigth:500px;float right;background #ddd} <style> </head> <body> <div class="main"> <div class="left"></div> <div class="right"></div> </div> </body> </html>查看全部 -
清楚浮动时: 除了clear:both; float：none;也可以唉.查看全部
-
网页布局：又称版式布局，是网页UI设计师将有限的视觉元素进行有机的排列组合，将理性的思维个性化的表现出来，是一种具有个人艺术特色的视觉传达方式。传达信息的同时有美感。 网页设计特点（相对纸媒来说） 1、网页可以自适应宽度(百分比自适应宽度） 2、网页的长度理论上可以无限延长（高度自适应） 一般是头部，主体，底部。主体一般再根据需要分栏，一般两栏或者三栏，还有可能分为更多的栏目。常见分栏方式：一、二、三、列布局，混合布局。查看全部
举报
0/150
提交
取消