absolute的元素不会占据未浮动的元素的空间<html>
<head>
<style type="text/css">
.flipbox{
  width: 500px;
  height:500px;
  position: relative;
}
.sidea{
  height: 400px;
  width:500px;
  background: green;
}
.sideb{
  width: 100%;
  height: 100%;
  position: absolute;
  background: blue;
}
</style>
</head>
<body>
<div class="flipbox">
  <div class="sidea">side a</div>
  <div class="sideb">side b</div>
</div>

</body>
</html>

css position absolute 浮动特性的更多相关文章

  1. CSS position:absolute浅析

    一.绝对定位的特征 绝对定位有着与浮动一样的特性,即包裹性和破坏性. 就破坏性而言,浮动仅仅破坏了元素的高度,保留了元素的宽度:而绝对定位的元素高度和宽度都没有了. 请看下面代码: <!DOCT ...

  2. css position: absolute、relative详解

    CSS2.0 HandBook上的解释: 设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的位置 ...

  3. css position absolute相对于父元素的设置方式

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 大家知道css的position abs ...

  4. css position:absolute 如何居中对齐

    写死宽度,就好弄了 position: absolute;left: 50%;width: 980px;margin-left: -490px; text-algin:center

  5. CSS position: absolute、relative定位问题详解

    CSS2.0 HandBook上的解释:  设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位,而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的 ...

  6. css position:absolute align center bottom

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

  7. CSS position relative absolute fixed

    position属性absolute与relative 详解   最近一直在研究javascript脚本,熟悉DOM中CSS样式的各种定位属性,以前对这个属性不太了解,从网上找到两篇文章感觉讲得很透彻 ...

  8. css之float(浮动)的特性

    详解CSS float属性  float本身不脱离文档流,但是和 position:absolute;搭配使用会脱离文档流 阅读目录 基础知识 float的详细细节 float特殊情况 clear属性 ...

  9. css之absolute绝对定位（绝对定位特性）

    学习了绝对定位以后,对此进行一个总结,啦啦啦啦~ 绝对定位特性 1.破坏性 破坏了原有的位置,从文档流里脱离出来 2.包裹性 如果下面这种情况,父级元素将不会有高度和宽度,失去原有的大小

随机推荐

  1. PHP图片识别成文字

    http://apistore.baidu.com/apiworks/servicedetail/146.html 分类: php2011-- : 3576人阅读 评论() 收藏 举报 phpfunc ...

  2. Python开发qq批量登陆

    操作步骤: 1.打开qq软件 2.移动鼠标到qq输入处 3.在输入处,点击鼠标,输入帐号 4.模拟按下tab键,输入密码,模拟点回车登录 #coding=utf-8 import os import ...

  3. linux内核的oops

    什么是Oops?从语言学的角度说,Oops应该是一个拟声词.当出了点小事故,或者做了比较尴尬的事之后,你可以说"Oops",翻译成中国话就叫做“哎呦”.“哎呦,对不起,对不起,我真 ...

  4. 大数据(3) - 高可用 HDFS HA

    HDFS HA高可用 1 HA概述 1)所谓HA(high available),即高可用(7*24小时不中断服务). 2)实现高可用最关键的策略是消除单点故障.HA严格来说应该分成各个组件的HA机制 ...

  5. request.getParameterValues()用法

    <form name="checkform" method="post" action="getvalue.jsp"> 你希望学 ...

  6. 深入理解:单一入口、MVC、ORM、CURD、ActiveRecord概念

    本篇文章是对单一入口.MVC.ORM.CURD.ActiveRecord概念进行了详细的分析介绍,需要的朋友参考下     MVC MVC是一个设计模式,它强制性的使应用程序的输入.处理和输出分开.使 ...

  7. POJ 1815 Friendship(最小割)

    http://poj.org/problem? id=1815 Friendship Time Limit: 2000MS   Memory Limit: 20000K Total Submissio ...

  8. 26计算限制的异步操作02-CLR

    由CLR via C#(第三版) ,摘抄记录... 6 Parallel的静态For,ForEach和Invoke方法 在一些常见的编程情形中,使用任务也许会提升性能.为了简化编程,静态类System ...

  9. 1052 最大M子段和(DP)

    1052 最大M子段和 基准时间限制:2 秒 空间限制:131072 KB 分值: 80 难度:5级算法题 N个整数组成的序列a[1],a[2],a[3],…,a[n],将这N个数划分为互不相交的M个 ...

  10. EasyNVR和EasyDSS云平台联手都不能解决的事情，只有国标GB28181能解决了

    需求痛点 我们经常收到这样一种需求,就是将客户手里的各种类型的网络摄像机IPC和网络硬盘录像机NVR进行统一的整合接入和管理,并进行常规的直播.存储.录像检索和回放等操作,而这个时候我们通常会选择用E ...