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

大致效果

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

 

【html】【8】div布局[子div在父div居底]的更多相关文章

  1. 子div设置浮动无法把父div撑开。

    <div class="mainBox"> <div class="leftBox"></div> <div clas ...

  2. 子div设置float后导致父div无法自动撑开的问题

    子div设置float后会导致父div无法自动撑开 原因:内部的DIV因为float:left之后,就丢失了clear:both和display:block的样式,所以外部的DIV不会被撑开. 以下是 ...

  3. DIV布局之道三:DIV块的覆盖,DIV层遮盖其他DIV

    DIV布局网页的第三种方式:覆盖.DIV覆盖方式经常应用于网页弹出框的制作,例如在网店系统中,当用户没有登录时,点击购买,系统弹出一个登陆框. 请看代码: HTML部分: XML/HTML Code复 ...

  4. DIV布局之道二:DIV块的嵌套,DIV盒子模型

    本文讲解DIV块布局的第二种使用方式:嵌套.“DIV嵌套”在有些文献中也被称为“盒子模型”,说的通俗一点就是嵌套(一个大的DIV块内部又包含一个或多个DIV块). 请看如下代码: CSS部分: CSS ...

  5. 子元素div高度不确定时父div高度如何自适应

    粘自:http://www.jb51.net/css/110652.html 在最外层div加以下样式 height:100%; overflow:hidden; 其它方法: Div即父容器不根据内容 ...

  6. iframe弹出层中关闭包含iframe的div(子页面调用父页面js函数)

    父页面: <div id="win2" style=" width:300px; height:200px; border:1px solid red;" ...

  7. 让一个小Div(子)在大Div(父)中垂直水平都居中

    方法1: .parent {          width:800px;          height:500px;          border:2px solid #000;          ...

  8. Position a child div relative to parent container in CSS: [设置 子DIV位置 跟 父DIV相关联]

    最近调DIV的位置比较头疼,各种position: relative / absolute google到一篇好文章[http://www.webdevdoor.com/html-css/css-po ...

  9. 子div设置margin-top使得父div也跟着向下移动

    之前在写网页的时候,发现一个小问题,就是子div设置margin-top的时候,父的div也会跟着向下移动.我用代码和图描述一下问题: <span style="font-size:1 ...

随机推荐

  1. spring利用javamail,quartz定时发送邮件 <转>

    原文地址:spring利用javamail,quartz定时发送邮件 <转>作者:物是人非 spring提供的定时发送邮件功能,下面是一个简单的例子以供大家参考,首先从spring配置文件 ...

  2. c/c++中使用指针需要注意的问题

    一.使用指针的时候需要注意几点: 分配空间 初始化 释放 二.常见的错误有几种: 1)内存分配未成功,却使用了它      编程新手常犯这种错误,因为他们没有意识到内存分配会不成功.常用解决办法是,使 ...

  3. 汽车行业DMS系统介绍

    http://blog.sina.com.cn/s/blog_55ceb8f30100hdr8.html 1.汽车行业DMS系统功能介绍DMS是Dealer Management System的简称, ...

  4. 数据库中DDL、DML、DCL和TCP概念

    1.DDL(Data Definition Language)数据库定义语言statements are used to define the database structure or schema ...

  5. EasyUI基础入门之Easyloader(载入器)

    在了解完easyui的parser(解析器)之后,接下来就是easyloader(简单载入器)的学习了. 什么是EasyLoader 正如其名字一样easyloader的作用是为了动态的载入组件所需的 ...

  6. java基础复习之对于String对象,能够使用“=”赋值,也能够使用newkeyword赋值,两种方式有什么差别?

    String类型是实际工作中经经常使用到的类型,从数据类型上划分,String是一个引用类型,是API中定义的一个类.所以String类型的对象能够用new创建,比如String name=new S ...

  7. starling localToGlobal

    o.localToGlobal(new Point());   返回o在舞台的全局坐标... o.parent.localToGlobal(new Point(o.x,o.y))   //返回指定坐标 ...

  8. firefly 问题

    1.G:\servers\Python27\Lib\mimetypes.py reload(sys) sys.setdefaultencoding('gb18030') 2.G:\servers\Py ...

  9. 【转】C语言 字符数组与字符串

    原文:http://blog.csdn.net/metasearch/article/details/2856097 在C语言编程中,当我们声明一个字符串数组的时候,常常需要把它初始化为空串.总结起来 ...

  10. 【转】 如何利用Cocos2d-x开发一个游戏

    原文:http://blog.csdn.net/honghaier/article/details/7888592 这个问题的结果应该是一个流程.我将从一些长期的PC端游戏开发经验结合Cocos2d- ...