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. NSCondition(转)

    NSConditionLock 继承类NSObject 遵从的协议NSLocking NSObject NSConditionLock 类定义特定的.用户定义的条件锁 协议NSLocking 方法 l ...

  2. 使用Squid搭建HTTPS代理服务器

    由于经常去的一些国外网站如Google.Blogspot.Wordpress被"出现了技术问题",访问不了,于是我在自己的DigitalOcean云主机上搭建了一个 Squid代理 ...

  3. Cocos2dx的ClippingNode裁剪节点使用方式

    1.http://shahdza.blog.51cto.com/2410787/1561937 2.http://www.firedragonpzy.com.cn/index.php/archives ...

  4. Win10系统如何配置Tomcat环境变量

    我们知道win10用户在配置Tomcat环境变量的时候,首先需要配置JAVA,这样才能配置Tomcat环境.很多用户并不知道要如何进行配置,下面就给大家介绍win10系统怎样Tomcat环境变量的. ...

  5. C++ 虚析构(virtual destructor)原理

    注意:本文仅为个人理解,可能有误! 先看一段代码: #include <iostream> using namespace std; class CBase{ public: CBase( ...

  6. C++ RTTI的应用

    先看下方的代码,我们所处的context在<<< void* pX = (void*)pGiven; >>>处,只知道上面这些类的信息和pX指针,怎么判断pX指向对 ...

  7. git的优秀教程

    1.csdn地址:http://blog.csdn.net/qq_15037231/article/details/73864293 2.廖雪峰的git教程  地址:https://www.liaox ...

  8. cocos2dx - 部署到android真机上错误整理

    利用Cgywin编译工具来将cocos2dx 在Android运行所需要的C++文件编译 1. ./build_native.sh(最后一把执行出错) please define NDK_ROOT i ...

  9. 【Cocos游戏实战】功夫小子第八课之游戏打包和相关问题说明

    至此,功夫小子系列的Cocos2d-x的实战文章就结束了. 源代码地址: https://github.com/SuooL/KungfuBoy 如须要资源请邮件我 1020935219@qq.com ...

  10. Mac Navicat_Premium_mac破解中文版

    原文地址:https://www.52pojie.cn/thread-727433-1-1.html Navicat_Premium_mac  最新版 12.0.24(原版是英文的) 汉化:安装完之后 ...