PHP自学之路-----DIV+CSS(第四天）

浮动

在DIV+CSS中浮动分为左浮动，右浮动，清除浮动 

1、右浮动

    所谓的右浮动，指一个块元素向右移动，让出自己的空间向右移动知道碰到包含自己的父元素的最右边的边框。如下图所示：

    测试代码如下：

     
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> 浮动案例 </title>
  <link rel="stylesheet" style="text/css" href="float.css"/>
 </head>

 <body>
    <div class="div1" id="id1">div1</div>
    <div class="div1">div2</div>
    <div class="div1">div3</div>
  
 </body>
</html>
.div1{
   width:150px;
   height:100px;
   border:1px solid red;
   background:pink;
   margin-top:5px;
}
/*id 选择器*/
#id1{
   float:right;
}


2、  


 

posted @ 2013-04-23 12:16  坚固66  阅读(112)  评论(0)  编辑  收藏  举报