1、static(静态定位):默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

2、relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。  

3、absolute(绝对定位):生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。可通过z-index进行层次分级。

4、fixed(固定定位):生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。可通过z-index进行层次分级。

原文:https://blog.csdn.net/qq_17431235/article/details/56017116

position三种属性的区别的更多相关文章

  1. 链接属性rel=’external’、rel=’nofollow’、rel=’external nofollow’三种写法的区别

    链接属性rel='external'.rel='nofollow'.rel='external nofollow'三种写法的区别   大家应该都知道rel='nofllow'的作用,它是告诉搜索引擎, ...

  2. <script>, <script async>, <script defer> 三种标签的区别

    <script>, <script async>, <script defer> 三种标签的区别 <script>标签 阻塞html parsing 脚 ...

  3. 关于JSP页面中的pageEncoding和contentType两种属性的区别

    转自:http://blog.csdn.net/dragon4s/article/details/6604624 JSP指令标签中<%@ page contentType="text/ ...

  4. Delphi2010中DataSnap高级技术(7)—TDSServerClass中Lifecycle生命周期三种属性说明

    Lifecycle 三种属性: Session.Invocation.Server 这三种属性都用在什么情况,有什么要注意的事项,Delphi2010中罕有说明. 如果乱用这三种属性,你的服务程序有可 ...

  5. Spark学习笔记-三种属性配置详细说明【转】

    相关资料:Spark属性配置  http://www.cnblogs.com/chengxin1982/p/4023111.html 本文出处:转载自过往记忆(http://www.iteblog.c ...

  6. DataSnap高级技术(7)—TDSServerClass中Lifecycle生命周期三种属性说明

    From http://blog.csdn.net/sunstone/article/details/5282666 DataSnap高级技术(7)—TDSServerClass中Lifecycle生 ...

  7. Iass、Pass、SasS三种云服务区别?

    Iass.Pass.SasS三种云服务区别 我们可以把云计算理解成一栋大楼,而这栋楼又可以分为顶楼.中间.低层三大块.那么我们就可以把Iass(基础设施).Pass(平台).Sass(软件)理解成这栋 ...

  8. 《Java多线程面试题》系列-创建线程的三种方法及其区别

    1. 创建线程的三种方法及其区别 1.1 继承Thread类 首先,定义Thread类的子类并重写run()方法: package com.zwwhnly.springbootaction.javab ...

  9. jQuery中detach&&remove&&empty三种方法的区别

    jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...

随机推荐

  1. 极其简单的VSCode C++环境配置

    下载我打包的文件VSCode-cpp.7z.001 和 VSCode-cpp.7z.002,解压. 在系统环境变量中添加:你解压的路径\Project\.vscode\MinGW\bin. 打开你解压 ...

  2. Linux下SSH远程连接断开后让程序继续运行解决办法

    一.screen安装 yum  install screen   #CentOS安装 sudo apt-get install screen #ubuntu安装 二.screen常用命令 screen ...

  3. os.remove异常处理

    这种情况,正反斜杠都没问题.(windows环境下) 这种情况会出现下列异常 对于目录的形式,把反斜杠改成正斜杠就好了

  4. 为wordpress后台登陆添加算术验证码

    对于新建站(个人博客-柠檬https://ninmong.com)的站长来说提高后台的安全性,是一件非常重要的事,添加验证可以起到很好的效果,废话少说,贴代码 //后台登陆数学验证码 function ...

  5. CEBX格式的文档如何转换为PDF格式文档、DOCX文档?

    方正阿帕比CEBX格式的文档如何转换为PDF格式文档.DOCX文档? 简介: PDF.Doc.Docx格式的文档使用的非常普遍,金山WPS可以直接打开PDF和Doc.Docx文档,使用也很方便. CE ...

  6. 获取访问者IP

    在一般情况下使用Request.getRemoteAddr()即可,但是经过nginx等反向代理软件后,这个方法会失效.     * 本方法先从Header中获取X-Real-IP,如果不存在再从X- ...

  7. Oracle之数组

    记忆力不好,提供样例套路: 固定长度数组: declare type t_test ) ); test t_test := t_test('a', 'b', 'c', 'd', 'e'); begin ...

  8. python两个列表合并为字典,一个作为key,一个作为value

    两个列表合并为一个字典函数list_dic(list1,list2)可以直接复制拿走 传入的参数为两个列表,list1准备作为key,list2准备作为value,key和value位置一一对应. d ...

  9. 『高性能模型』HetConv: HeterogeneousKernel-BasedConvolutionsforDeepCNNs

    论文地址:HetConv 一.现有网络加速技术 1.卷积加速技术 作者对已有的新型卷积划分如下:标准卷积.Depthwise 卷积.Pointwise 卷积.群卷积(相关介绍见『高性能模型』深度可分离 ...

  10. 初步接触gulp

    首先是安装nodejs,通过nodejs的npm全局安装和项目安装gulp,其次在项目里安装所需要的gulp插件,然后新建gulp的配置文件gulpfile.js并写好配置信息(定义gulp任务),最 ...