Position有四个属性值,分别是static 、fixed、 relative 、absolute。

第一个属性值是static,这是position的默认属性,一般我们都不会用到它,所以也很少提到它,但是在特殊的情况下,它又有着不可替代的作用,比如,在媒体查询页面当中,正常页面当中需要给元素加position属性,但是在响应式页面中不需要,这是就只能用position:static;没有position:none;的写法,网页也不会识别。

第二个属性fixed——固定定位,fixed是相对于window窗口的定位,一般在网页中也会经常看到,例如置顶,等

第三个属性值relative——相对定位;相对于自己本身的定位;这个定位一般是和absolute属性值一起用;相对定位不会破坏元素的文本流,但是会改变元素的视觉效果

第四个属性值absolute——绝对定位;相对于父级元素的定位,如果没有父级元素时相对于窗口的定位;

需要注意的是static relative这两个属性值是不会破坏元素的文本属性;但是fixed 和 abosulte则会改变元素的文本流,有float的效果。

position中的四种属性的更多相关文章

  1. css样式表中四种属性选择器

    学习此连接的总结http://developer.51cto.com/art/201009/226158.htmcss样式表中四种属性选择器1> 简易属性 tag[class]{ font-we ...

  2. JSP中四种属性保存范围(1)

    一.四种属性范围 在JSP中提供了四种属性保存范围 page:在一个页面内保存属性,跳转之后无效request:在一次服务请求范围内,服务器跳转后依然有效session:-在一次会话范围内,无论何种跳 ...

  3. JSP九大内置对象和四种属性范围解读

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:本文首先主要解说了JSP中四种属性范围的概念.用法与实例. 然后在这个基础之上又引入了九 ...

  4. JavaScript确定一个字符串是否包含在另一个字符串中的四种方法

    一.indexOf() 1.定义 indexOf()方法返回String对象第一次出现指定字符串的索引,若未找到指定值,返回-1.(数组同一个概念) 2.语法 str.indexOf(searchVa ...

  5. Jsp学习总结(1)——JSP九大内置对象和四种属性范围解读

    一.四种属性范围 1.1.在JSP中提供了四种属性保存范围 page:在一个页面内保存属性,跳转之后无效 request:在一次服务请求范围内,服务器跳转后依然有效 session:-在一次会话范围内 ...

  6. jsp四种属性范围

    在JSP提供了四种属性的保存范围.所谓的属性保存范围,指的就是一个设置的对象,可以在多个页面中保存并可以继续使用.它们分别是:page.request.session.appliction. 1.pa ...

  7. Hive 中的四种排序详解,再也不会混淆用法了

    Hive 中的四种排序 排序操作是一个比较常见的操作,尤其是在数据分析的时候,我们往往需要对数据进行排序,hive 中和排序相关的有四个关键字,今天我们就看一下,它们都是什么作用. 数据准备 下面我们 ...

  8. 对称加密和分组加密中的四种模式(ECB、CBC、CFB、OFB)

    一. AES对称加密: AES加密 分组 二. 分组密码的填充 分组密码的填充 e.g.: PKCS#5填充方式 三. 流密码:   四. 分组密码加密中的四种模式: 3.1 ECB模式 优点: 1. ...

  9. JAVA基础学习之throws和throw的区别、Java中的四种权限、多线程的使用等(2)

    1.throws和throw的区别 throws使用在函数外,是编译时的异常,throw使用在函数内,是运行时的异常 使用方法 public int method(int[] arr) throws ...

随机推荐

  1. Verilog代码和FPGA硬件的映射关系(五)

    既然我们可以指定寄存器放在IOB内,那我们同样也可以指定PLL的位置.首先要确保我们有多个PLL才行.如图1所示,我们所使用的EP4CE10F17C8芯片刚好有两个. 图 1 为了演示这个例子,我们使 ...

  2. 【Ubuntu】Ubuntu系统启动过程中,输入用户名与密码后登录一直卡在紫色界面问题(未解决,最后通过重装系统)

    0. 前言 由于本电脑为公用电脑,可能由于其他人点了图像界面中推荐的内核更新,导致原来安装的NVIDIA显卡驱动 430 与升级后的 5.0 内核不兼容,从而导致输入用户名后登录一直卡在紫色界面.在排 ...

  3. [Objective-C] 016_UI篇_UIView(上)

    在我们使用app时屏幕上能看到的UI元素(按钮,列表,图片...),我们称之为视图,都是继承与UIView,它们通常有着位置,大小,背景颜色等属性,在appl中视图和窗口展示了应用的用户界面,同时负责 ...

  4. 【JVM】垃圾回收的四大算法

    GC垃圾回收 JVM大部分时候回收的都是新生代(伊甸区+幸存0区+幸存1区).按照回收的区域可以分成两种类型:Minor GC和Full GC(MajorGC). Minor GC:只针对新生代区域的 ...

  5. SSI PAYLOAD

    <pre><!--#exec cmd="ls" --></pre><pre><!--#echo var="DATE_ ...

  6. 50个SQL语句(MySQL版) 问题十六

    --------------------------表结构-------------------------- student(StuId,StuName,StuAge,StuSex) 学生表 tea ...

  7. (二)用less+gulp+requireJs 搭建项目(gulp)

    gulp是自动化构建工具,基于node,需要安装node,如果你不了解node也没关系,先跟着来一遍再去了解node也不迟~ 首先去node官网下载安装包 1.新建项目文件夹 在目录下shift+右键 ...

  8. Java实现 LeetCode 757 设置交集大小至少为2(排序+滑动窗口)

    757. 设置交集大小至少为2 一个整数区间 [a, b] ( a < b ) 代表着从 a 到 b 的所有连续整数,包括 a 和 b. 给你一组整数区间intervals,请找到一个最小的集合 ...

  9. Java实现 LeetCode 137 只出现一次的数字 II(二)

    137. 只出现一次的数字 II 给定一个非空整数数组,除了某个元素只出现一次以外,其余每个元素均出现了三次.找出那个只出现了一次的元素. 说明: 你的算法应该具有线性时间复杂度. 你可以不使用额外空 ...

  10. Java实现 LeetCode 68 文本左右对齐

    68. 文本左右对齐 给定一个单词数组和一个长度 maxWidth,重新排版单词,使其成为每行恰好有 maxWidth 个字符,且左右两端对齐的文本. 你应该使用"贪心算法"来放置 ...