现在的位置: 首页 > 综合 > 正文

CSS float的经验分享

2013年10月16日 ⁄ 综合 ⁄ 共 660字 ⁄ 字号 评论关闭

在做页面设计时,以前总是在两个浮动中间留一条边边 很难看,

html:

 
  <body>
    <div id="page-container">
    page-container
    	<div id="top" >top</div>
    	<div id="menuBar" >MenuBar</div>
    	<div id="left" >Left</div>
    	<div id="centre" >Centre</div>
    	<div id="right" >Right</div>
    	<div id="footer" >Footer</div>
    </div>
  </body>

CSS1:

#left
{
	background-color:orange;
	padding:0 0 0 0;
	float:left;
	width:15%;
	height:600px;
}

#centre
{
	background-color:white;
	padding:0 0 0 0;
	width:70%;
	color:black;
    height:600px;
   

}
#right
{
	background-color:black;
	float:right;
	width:15%;
	height:600px;
	margin-top:-600px;
	margin-left:75%;
}

效果这样

 

如果改一下 CSS中间的Centre 加上一句Float

#centre
{
	background-color:white;
	padding:0 0 0 0;
	width:70%;
	color:black;
    height:600px;
    float:left;/*就加上这一句效果就完全不同了!!!!!!!!!*/
   

}

抱歉!评论已关闭.