【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 学习要坚持 不要贪多~~~
阿亮的笔记