1.switch--fixed,div脱离父元素,top,left,right,bottom都是相对于body,自己原来的位置不存在,即不占父元素位置了

2.switch--relative,div相对于自己原来的位置,还是会占父元素位置

3.switch--absolute,div相对于父元素的位置(要求父元素必须有位置属性,逐级网上寻找),不占父元素位置

https://segmentfault.com/a/1190000006924181

对于position:relative,absolute,fixed的见解:的更多相关文章

  1. CSS position relative absolute fixed

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

  2. css属性position: static|relative|absolute|fixed|sticky简单解析

    目录 static 静态定位(默认) relative 相对定位 正常文档流 加了relative之后的布局 加上margin/padding/border之后的布局 absolute 绝对定位 正常 ...

  3. What is the difference between position: static,relative,absolute,fixed

    What is the difference between static,relative, absolute,fixed we can refer to this link: expand

  4. css的定位，relative/absolute/fixed的用法

    其实position的值有四个,static/relative/absolute/fixed,而static是默认值,不算具有有定位属性,这里就不讲了. 定位其实就是跟元素设置定位属性,然后设置其对位 ...

  5. CSS之定位，relative/absolute/fixed的用法

    其实position的值有四个,static/relative/absolute/fixed,而static是默认值,不算具有有定位属性,这里就不讲了. 定位其实就是跟元素设置定位属性,然后设置其对位 ...

  6. css position static | absolute | fixed | relative

    <div id="bigbox1">    <div id="box1" class="box">box1</ ...

  7. css position: relative | absolute | static | fixed详解

    static(静态):没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级. fixed(固定定位):这里所固定的参照对象是可视窗口而并非是body或是父级元素.可通过z-index ...

  8. position:relative/static/fixed/absolute定位的区别以及使用场景

    absolute是相对于自己最近的父元素来定位的,relative是相对于自己来定位的 relative 不脱离文档流,absolute 脱离文档流.也就是说:relative 的元素尽管表面上看到它 ...

  9. CSS定位：相对定位、绝对定位和固定定位（relative absolute fixed）

    相对定位:position:relative; 不脱离文档流,参考自身静态位置通过top,bottom,left,right定位,并且可通过z-index进行层次分级. 绝对定位:position:a ...

随机推荐

  1. while循环 for循环的理解

    不管是while循环还是for循环都隐含着一个if else的结构,就是说,if 条件满足,那么就执行循环体内部的语句,else就做循环体外部的事情. 有一个例子我觉得特别典型,程序内部定义了一个特定 ...

  2. Python基础 之 变量、用户交互、if条件语句、while循环语句、编码、逻辑运算

    一.Python介绍 Python 崇尚优美.清晰.简单 Python是一门动态解释型的强制性定义的语言. 二.编译型和解释型的区别 编译型:一次性将所有与程序编译成二进制文件. 缺点:开发效率低,不 ...

  3. c# 常规验证基类

    using System;using System.Collections.Generic;using System.Linq;using System.Text.RegularExpressions ...

  4. 单个控件textbox只支持在英文状态下输入所需的字符串

    也就是它的属性: Imemode的属性 设置成off就可以了 ,就不会受到所输入的中文汉字了.

  5. （转）不定义JQuery插件，不要说会JQuery

    原文地址:http://www.cnblogs.com/xcj26/p/3345556.html 一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#" ...

  6. (转)Entity Framework 5.0系列之自动生成Code First代码

    原文地址:http://www.cnblogs.com/kenshincui/archive/2013/08/29/3290527.html 在前面的文章中我们提到Entity Framework的“ ...

  7. 设计模式06： Adapter 适配器模式（结构型模式）

    Adapter 适配器模式(结构型模式) 适配(转换)的概念无处不在:电源转接头.电源适配器.水管转接头... 动机(Motivation)在软件系统中,由于应用环境的变化,常常需要将“一些现存的对象 ...

  8. MongoDB整理笔记の走进MongoDB世界

    本人学习mongodb时间不长,但是鉴于工作的需要以及未来发展的趋势,本人想更深层的认识mongodb底层的原理以及更灵活的应用mongodb,边学边工作实践.  mongodb属于nosql中算是最 ...

  9. 从头开始学eShopOnContainers——开发环境要求

    一.简介 eShopOnContainers是一个简化版的基于.NET Core和Docker等技术开发的面向微服务架构的参考应用,是一个简化版的在线商城/电子商务应用,其包含基于浏览器的Web应用. ...

  10. 如何将Sql server数据库中的模型图转化到Word中--并能够查看字段的属性信息

    1. 在Sql server数据库中创建数据库的模型图 -- Database Diagrams 2. 控制面板--管理工具--ODBC数据源链接--创建一个Sql server的数据源链接 3. 打 ...