<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

 <title>无标题文档</title>

 <style type="text/css">

 <!--

 html,body{

 height:100%;

 }

 .box1 {

     background-color: #0000FF;

     height:100%;

     position:relative;

 }

 .box2 {

     background-color: #00FFFF;

     height:90%;

     width:90%;

     left:5%;

     top:5%;

     position:absolute;

 }

 .box3 {

     background-color: #FFFF00;

     height:20%;

     width:20%;

     right:5%;

     bottom:5%;

     position:absolute;

 }

 -->

 </style>

 </head>

 <body>

 <div class="box1">

   <div class="box2">

     <div class="box3"></div>

   </div>

 </div>

 </body>

 </html>

盒子尺寸父子传递及嵌套Demo的更多相关文章

  1. --@angularJS--较复杂的指令嵌套demo——综合小实例：登陆界面

    1.index.html: <!DOCTYPE HTML><html ng-app="app"><head>    <title>c ...

  2. Css3盒子尺寸

    box-sizing属性 用来改变盒模式中的宽度和高度默认的计算方式. box-sizing: 1.content-box(默认值): 宽度和高度只包含内容区域 2.border-box: 宽度和高度 ...

  3. HTML盒子尺寸的计算

    参考链接http://edu.51cto.com/lesson/id-54739.html

  4. box-sizing 可以使border padding不影响设置的盒子尺寸

  5. ThreadLocal父子线程传递实现方案

    介绍InheritableThreadLocal之前,假设对 ThreadLocal 已经有了一定的理解,比如基本概念,原理,如果没有,可以参考:ThreadLocal源码分析解密.在讲解之前我们先列 ...

  6. 聊聊css盒子模型

    css盒子模型原理: 在网页设计中常听的属性名:内容(content).填充/内边距(padding).边框(border).外边距(margin), CSS盒子模式都具备这些属性. 这些属性我们可以 ...

  7. 从零开始学 Web 之 CSS（三）链接伪类、背景、行高、盒子模型、浮动

    大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...

  8. CSS盒子模型之CSS3可伸缩框属性（Flexible Box）

    CSS盒子模型(下) 一．CSS3可伸缩框(Flexible Box) 可伸缩框属性(Flexible Box)是css3新添加的盒子模型属性,有人称之为弹性盒模型,它的出现打破了我们经常使用的浮动布 ...

  9. CSS的盒子模型（Box Model）

    盒子模型(Box Model)是 CSS 的核心,现代 Web 布局设计简单说就是一堆盒子的排列与嵌套,掌握了盒子模型与它们的摆放控制,会发现再复杂的页面也不过如此. 然而,任何美好的事物都有缺憾,盒 ...

随机推荐

  1. sublime快捷键使用

    sublime常用快捷键 自己觉得比较实用的sublime快捷键有: Ctrl+/..................注释 Ctrl+滚动..................字体变大.缩小 Ctrl+ ...

  2. CF867E： Buy Low Sell High（贪心， STL） （hdu6438）

    Description 有nn个城市,第ii个城市商品价格为aiai​,从11城市出发依次经过这nn个城市到达n n城市,在每个城市可以把手头商品出售也可以至多买一个商品,问最大收益. Input 第 ...

  3. useradd和groupadd（Linux创建用户\用户组\设置\分配用户权限\多用户远程登录权限）的使用

    前言: man useradd man  groupadd info useradd info  groupadd 都可以获取相关命令的用法信息. 个人比较喜欢读英文解释文档,没有你想象的那么comp ...

  4. python中sys模块之输入输出错误流

    import sys sys.stdout.write("msg")   # 控制台白色字体打印 普通输出流 sys.stderr.write("msg") # ...

  5. 再谈Retina下1px的解决方案

    https://www.w3cplus.com/css/fix-1px-for-retina.html

  6. Css新增内容

    css3新增属性 可节省设计时间的属性 border-color:控制边框的颜色,并且有更大的灵活性,可以产生渐变效果 border-image:控制边框图像 border-radius:能产生类似圆 ...

  7. Address already in use: JVM_Bind:80 异常的解决办法

    java.net.BindException: Address already in use: JVM_Bind:80 异常的解决办法 今天遇见了这个端口被占用问题 然后各种百度 先是说 用命令 ne ...

  8. hadoop的一点小常识(1.0环境)

  9. pip install torch on windows, and the 'from torch._C import * ImportError: DLL load failed:' solution

    通过pip安装PyTorch 0.4.0成功(cpu, not gpu; python3.5; pip): pip3 install http://download.pytorch.org/whl/c ...

  10. MySQL命令行登陆，远程登陆MySQL 的方法

    https://www.cnblogs.com/lvk618/p/3522321.html 1.MySQL自带工具的存放路径: D:\Program Files\MySQL\MySQL Server ...