fixed:固定定位

absolute:绝对定位

区别很简单:

1、没有滚动条的情况下没有差异

2、在有滚动条的情况下,fixed定位不会随滚动条移动而移动,而absolute则会随滚动条移动

常用场合:

1.fixed常用于网站边缘的公司联系方式和快速回到顶部

2.absolute常用于页面

、、、、、、、、、、、、、、、、、、、、、、、

我们知道,css的position定位属性中,表示绝对定位的有两个值,值absolute与值fixed。

都是绝对定位,二者有一致性,也有不同点。那么二者的区别是什么呢?那就是position的fixed值定位的元素会固定在原来的位置不变,不管你如何拖动滚动条,元素都不会改变位置,这从fixed这个英文单词的意思也可以看出,“固定的,不变的,固执的”。而absolute正好相反,拖动滚动条时元素会随着改变位置。

css的position中absolute和fixed的区别的更多相关文章

  1. CSS+DIV布局中absolute和relative区别

    原文:http://developer.51cto.com/art/201009/225201.htm 这里向大家简单介绍一下CSS+DIV布局中absolute和relative属性的用法和区别,定 ...

  2. css position 属性 (absolute 和fixed 区别)

    在css3中,position的属性值有:inherit, static, relative ,absolute, fixed. inherit 是继承父元素的position属性值,IE不支持. s ...

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

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

  4. position的absolute与fixed,absolute与relative共同点与不同点

    absolute与fixed 共同点: (1) 改变行内元素的呈现方式,display被置为block: (2) 让元素脱离普通流,不占据空间: (3) 默认会覆盖到非定位元素上 不同点: absol ...

  5. css总结1:position定位:absolute/relative/fixed

    1 [Positioning(定位)] Positioning作用:指定了元素的定位类型.position包括四个值:static,relative,fixed,absolute. css定位解析:元 ...

  6. css中的position 的absolute和relative的区别(转)

    我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流.top,right,bottom,left等属性不会被应用. relative:对象遵循 ...

  7. 【对比分析四】position的absolute与fixed共同点与不同点

    共同点: (1) 改变行内元素的呈现方式,display被置为block: (2) 让元素脱离普通流,不占据空间: (3) 默认会覆盖到非定位元素上 不同点: absolute的”根元素“是可以设置的 ...

  8. position的absolute与fixed共同点与不同点

    这个问题面试被问到过~~ A:共同点: 1.改变行内元素的呈现方式,display被置为block: 2.让元素脱离普通流,不占据空间: 3.默认会覆盖到非定位元素上   B不同点: absolute ...

  9. position定位-absolute与fixed

    1. absolute 生成绝对定位元素,相对于static定位以外的第一个父元素进行定位. 2. fixed 生成绝对定位元素,相对于浏览器窗口进行定位.

随机推荐

  1. 【组合数】[NOIP2011]选择客栈[c++]

    题目描述 丽江河边有n 家很有特色的客栈,客栈按照其位置顺序从 1 到n 编号.每家客栈都按照某一种色调进行装饰(总共 k 种,用整数 0 ~ k-1 表示),且每家客栈都设有一家咖啡店,每家咖啡店均 ...

  2. JS中的算法与数据结构——排序(Sort)

    排序算法(Sort) 引言 我们平时对计算机中存储的数据执行的两种最常见的操作就是排序和查找,对于计算机的排序和查找的研究,自计算机诞生以来就没有停止过.如今又是大数据,云计算的时代,对数据的排序和查 ...

  3. 旋转矩阵(Rotation Matrix)的推导及其应用

    向量的平移,比较简单. 缩放也较为简单 矩阵如何进行计算呢?之前的文章中有简介一种方法,把行旋转一下,然后与右侧对应相乘.在谷歌图片搜索旋转矩阵时,看到这张动图,觉得表述的很清晰了. 稍微复杂一点的是 ...

  4. cocos creator热更新教程

    1.下载HotUpdate热更新DEMO 2.在cocos creator中下载热更新插件,cocos creator版本要在1.7及以上版本 3.插件默认安装在C:\Users\Administra ...

  5. 利用Caffe训练模型(solver、deploy、train_val) + python如何使用已训练模型

    版权声明:博主原创文章,微信公众号:素质云笔记,转载请注明来源“素质云博客”,谢谢合作!! https://blog.csdn.net/sinat_26917383/article/details/5 ...

  6. 【Jenkins】新版本的特性:自定义流水线

    #!/usr/bin/env groovy pipeline { agent none stages { stage('stage-01') { agent { label 'master' } st ...

  7. python使用mysql

    python安装MySQLdb需要ssl,出错,原因如地址: https://stackoverflow.com/questions/46967488/getting-error-403-while- ...

  8. django 与 mysql 勾结指南

  9. Bizatlk Accelerator for RosettaNet安装与配置

    以下安装步骤是基于动手实验的BizTalk开发环境(<BizTalk动手实验(一)安装BizTalk Server 2010开发环境> )进行安装. 安装准备 运行账户配置 新建IIS_W ...

  10. 双网卡双线路DNS解析分析

    在企业网络维护过程中我们经常会遇到这样或那样的奇怪问题,而很多问题需要有深厚的理论知识才能解决.而随着网络的飞速发展越来越多的中小企业开始尝试通过多条线路来保证网络的畅通,一方面双网卡下的双线接入可以 ...