<!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. 最近的AI

    虚拟币和AI  两个大类怎么兴起?

  2. 【Effective Java读书笔记】创建和销毁对象（一）：考虑使用静态工厂方法代替构造器

    类可以提供一个静态方法,返回类的一个静态实例,如Boolean包装类的一个获取实例的静态方法 public static Boolean valueOf(boolean b) { return (b ...

  3. jmeter 测试MD5加密登录接口

    1.点击options-funciton helper dialog,打开函数助手 在string to  calculate MD5 hash 中填写密码,复制function sysntax中的值 ...

  4. s21day17 python笔记

    s21day17 python笔记 一.内容回顾及补充 回顾 补充 第三方模块补充 需要下载安装后才能导入使用 安装方式: pip包管理工具 # 把pip.exe 所在的目录添加到环境变量中. pip ...

  5. 微信小程序之点击列表的item带参数跳转界面

    1.在js文件里写个界面跳转的事件处理函数gotableinfo,var index = parseInt(e.currentTarget.dataset.index); 为获取当前点击列表的下脚标, ...

  6. Django_ORM字段_字段参数

    Object Relational Mapping (ORM) ORM:对象关系映射模式是一种为解决面向对象与关系数据库存在的互补匹配的现象技术.简单说就是通过使用描述对象和数据库之间的映射的元数据, ...

  7. for循环、while循环、break、continue、exit

    1. for循环 语法:for 变量名 in 条件; do …; done案例1 #!/bin/bashsum=0for i in `seq 1 100`do# echo "$sum + $ ...

  8. [USACO09HOL]假期绘画Holiday Painting

    观察到列数只有15,可以想到对于每一列维护一颗线段树 sum表示该区间与目标矩阵中该区间相同元素个数 lazy表示该区间应被修改成什么颜色 g即目标矩阵中该区间白色格子的个数 显然一个区间的sum=区 ...

  9. js获取世界不同时区的当前时间

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  10. 关于地形altas的处理

    前几天在群里跟人讨论地形atlas的问题,因为Blade也是用的4x4的atlas(16张纹理),但是大概是几年前做的,所以一些细节忘记了,在这里做下备忘. 1.atlas就是图集,图册,把多个纹理打 ...