【html】【8】div布局[子div在父div居底]

从今天起 开始细话div布局
 
思路及要点:
父div的位置设置成相对的,即“position: relative;”。
而子div的位置设置成绝对的,并且下边缘设为0,即“position: absolute; bottom: 0;”。
 
代码
 1 <head>
 2     <title>子div在父div中置底</title>
 3     <style type="text/css">
 4         .father { width: 500px; height: 600px; position: relative; background-color: AliceBlue; }
 5         .child { width: 400px; height: 100px; position: absolute; bottom: 0; background-color: AntiqueWhite; }
 6     </style>
 7 </head>
 8 <body>
 9     <div class="father">
10         <div class="child">
11         </div>
12     </div>
13 </body>
14 </html>

大致效果

 

ok  学习要坚持  不要贪多~~~

 

 
posted @ 2015-12-09 10:37  阿亮的笔记  阅读(1666)  评论(0编辑  收藏  举报