position的值, relative和absolute分别是相对于谁进行定位的?
relative: 相对定位,相对于自己本身在正常文档流中的位置进行定位 相对它原来的位置,在走100px。原来在标准流中的位置继续占有。
absolute: 生成绝对定位,相对于最近一级定位不为static的父元素进行定位。(子决父相)。
fixed: (老版本IE不支持)生成绝对定位,相对于浏览器窗口或者frame进行定位 跟父元素没关系。不随着滚动条的滚动而移动。固定在浏览器可视窗口的位置。
static: 默认值,没有定位,元素出现在正常的文档流中。相当none 没有定位的意思。没有边偏移我们几乎不用。
position: sticky; 基于用户的滚动位置来定位。
粘性定位的元素是依赖于用户的滚动,在 position:relative 与 position:fixed 定位之间切换。
它的行为就像 position:relative; 而当页面滚动超出目标区域时,它的表现就像 position:fixed;,它会固定在目标位置。
position的值, relative和absolute分别是相对于谁进行定位的?的更多相关文章
- 关于position的relative和absolute分别是相对于谁进行定位的
position:absolute; 他的意思是绝对定位,他是参照浏览器的左上角,配合TOP.RIGHT.BOTTOM.LEFT(下面简称TRBL)进行定位,在没有设定TRBL,默认依据父级的做标原始 ...
- display值的作用分别是什么?relative和absolute分别是相对谁定位的?
display值的作用分别是什么? none:元素隐藏,不占据位置 block:该元素显示为块级元素 inline:默认,该元素会被显示为内联元素 inline-block:行内块元素 list-it ...
- CSS的position属性:relative和absolute
relative:是相对于自己来定位的,例如:#demo{position:relative;top:-50px;},这时#demo会在相对于它原来的位置上移50px.如果它之前的元素也为relati ...
- 定位position详解:relative与absolute
定位标签:position 包含属性:relative(相对) absolute(绝对) 1.position:relative; 如果对一个元素进行相对定位,首先它将出现在它所在的位置上.然后通过设 ...
- 一张图看懂css的position里的relative和absolute的区别
position有以下属性:static.inherit.fixed.absolute.relative前三个好理解好区分:static:是默认状态,没有定位,元素出现在正常的流中(忽略 top, b ...
- CSS里Postion几个取值relative、absolute、static、fixed的区别和用法
---恢复内容开始--- static:静态定位,也是postion的默认值,没有定位,元素出现在正常的流中,忽略top\bottom\left\right或者z-index声明. relative: ...
- 前端~定位属性position(relative、absolute、fixed)的分析
前端~定位属性position(relative.absolute.fixed)的分析 1,简单了解: relative:移动自身时,参考自身的原来位置而移动,移动子元素(子元素设置了absolute ...
- position 有五个值:static、relative、absolute、fixed、inherit。
position 有五个值:static.relative.absolute.fixed.inherit. static 是默认值.就是按正常的布局流从上到下从左到右布局,平常我们做网页时,没有指定 ...
- 列出display的值,说明他们的作用。position的值, relative和 absolute定位原点是?
display的值: block 像块类型元素一样显示. none 像行内元素类型一样显示. inline-block 像行内元素一样显示, 但其内容像块类型元素一样显示. list-item 像块类 ...
- position 的值absolute、fixed、relative和static的定位原点是什么
position 的值absolute.fixed.relative和static的定位原点是什么 absolute 成绝对定位的元素,相对于值不为static的第一个父元素进行定位,也可以理解为离自 ...
随机推荐
- uni-app移动端开发中ios/安卓--坑和经验总结
1. ios new时间对象,需要用逗号隔开传日期的方式, 不支持 new Date('2019-03-01 08:00:00') 格式: 支持以下两种方式: 2. ios个别版本对fixed的属性的 ...
- 密码学—凯撒密码Python程序
文章目录 凯撒密码来源 加密算法 解密算法 凯撒密码来源 古典密码,且属于单表加密 凯撒密码又称恺撒变换.变换加密,凯撒是当时罗马共和时期恺撒的名字命名的,当年恺撒曾用此方法与其将军们进行联系.(当然 ...
- 如何启动?win11下的Linux子系统【4种方法】
实验室的开发环境在Linux操作系统下,时不时就需要打开Linux环境去操作,而且需要本地编译或者远程SSH.这时候window和Linux切换很不方便.本科的做法就是window+虚拟机的Linux ...
- mit 6.824 lab1 思路贴
前言 为遵守 mit 的约定,这个帖子不贴太多具体的代码,主要聊聊自己在码代码时的一些想法和遇到的问题. 这个实验需要我们去实现一个 map-reduce 的功能.实质上,这个实验分为两个大的板块,m ...
- Windows Server 2022 NTP服务器
一.配置NTP服务器 配置NTP服务器,为客户端提供时间同步服务. 如果计算机是Active Directory域控制器,则NTP服务器功能已自动启动. 因此,下面的示例是计算机在工作组环境中启用NT ...
- Java8新特性default关键字,引出Java多继承问题
概述 最近在看JDK集合的源码时,在Collection接口中发现了default关键字,并且惊奇的发现接口中的方法居然包含方法体,这顿时让我产生兴趣,为此我也稍微研究了一下default关键字. 很 ...
- mysql笔记第一天: 介绍和MySQL编译安装
一.DBA的工作内容:  ...
- 适用于linux的bilibiliB站直播间弹幕爬虫脚本
适用于linux的bilibiliB站直播间弹幕爬虫脚本,命令行运行之,输入到命令行,部分内容参考自网络,代码底部可见原始代码出处 BUFF:然而,经测试,每次爬只能读取10条弹幕记录,这就使得在(s ...
- umount 报错umount: /new_room: target is busy. (In some cases useful info about processes that use the device is found by lsof(8) or fuser(1))
挂载逻辑卷后,尝试更新逻辑卷的文件系统 [root@server lost+found]# umount /new_room/ umount: /new_room: target is busy. ( ...
- c# .net mvc 使用百度Ueditor富文本框上传文件(图片,视频等)
使用背景: 项目中需要用的富文本框去上传视频,图片的话大部分都是可以的.相对来说,国外的富文本框很成熟.但鉴于文档是英语,这里使用了百度的富文本框. 采用的api的方式,调用接口进行上传文件.话不多说 ...