html position属性作用,position(五种属性，以及每个属性的特点)

1. position: relative;相对定位

1> 不影响元素本身特性(无论区块元素还是内联元素会保留其原本特性)

2> 不会使元素脱离文档流(元素原本位置会被保留，即改变位置也不会占用新位置)

3> 没有定位偏移量时对元素无影响(相对于自身原本位置进行偏移)

4>提升层级(用z-index样式的值可以改变一个定位元素的层级关系，从而改变元素的覆盖关系，值越大越在上面，z-index只能在position属性值为relative或absolute或fixed的元素上有效。) (两个都为定位元素，后面的会覆盖前面的定位)

2. position: absolute;绝对定位

1> 使元素完全脱离文档流(在文档流中不再占位)

2> 使内联元素在设置宽高的时候支持宽高(改变内联元素的特性)

3> 使区块元素在未设置宽度时由内容撑开宽度(改变区块元素的特性)

4> 相对于最近一个有定位的父元素偏移(若其父元素没有定位则逐层上找，直到document——页面文档对象)

5> 相对定位一般配合绝对定位使用(将父元素设置相对定位，使其相对于父元素偏移)

6> 提升层级(同相对定位)

3. position: fixed;固定定位

fixed生成固定定位的元素，相对于浏览器窗口进行定位。

4. position:static：默认值

默认布局。元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

5. position: sticky 粘性定位

粘性定位，该定位基于用户滚动的位置。

它的行为就像 position:relative; 而当页面滚动超出目标区域时，它的表现就像 position:fixed;，它会固定在目标位置。

注意:Internet Explorer, Edge 15 及更早 IE 版本不支持 sticky 定位。 Safari 需要使用 -webkit- prefix 。

6. position: inherit

规定应该从父元素继承 position 属性的值。

7. posiyion: initial

initial 关键字用于设置 CSS 属性为它的默认值。

initial 关键字可用于任何 HTML 元素上的任何 CSS 属性。

html position属性作用,position(五种属性，以及每个属性的特点)相关推荐

zbb20180921 spring事物的七种事物传播属性行为及五种隔离级别
spring事物的七种事物传播属性行为及五种隔离级别事务,就是一组操作数据库的动作集合.事务是现代数据库理论中的核心概念之一.如果一组处理步骤或者全部发生或者一步也不执行,我们称该组处理步骤为一个事 ...
html5常见使用的属性,HTML5常见五种常规全局属性
HTML5中有很多的属性,新增了一个HTML中没有的属性:全局属性. 接下来一起看HTML5常见五种常规全局属性. contentEditable属性 contentEditable是由微软开发.被其 ...
【Kotlin】Kotlin 类的继承二 ( 属性覆盖 | 属性覆盖的四种情况 | 常量 / 变量属性覆盖 | 子类初始化与属性覆盖 )
文章目录 I . 属性覆盖基本方式 II . 属性覆盖的四种情况 III . 常量 ( val ) / 变量 ( var ) 属性覆盖 IV . 子类初始化时考虑覆盖属性的使用 I . 属性覆盖基本方 ...
简述css属性选择器的几种定义方式_CSS属性选择器
CSS选择器主要分为五大类:元素选择器,关系选择器,属性选择器,伪类选择器和伪元素选择器.平时用的最多的是元素选择器和关系选择器,而本文主要讲讲用得比较少的属性选择器. 首先亮出本文通用的例子: 张三 ...
简述css属性选择器的几种定义方式_CSS 属性选择器详解
根据具体属性值选择除了选择拥有某些属性的元素,还可以进一步缩小选择范围,只选择有特定属性值的元素. 例子 1 例如,假设希望将指向 Web 服务器上某个指定文档的超链接变成红色,可以这样写: a[h ...
css详解position五种属性用法及其含义
position(定位) position - 作为css属性三巨头(position.display.float)之一,它的作用是用来决定元素在文档中的定位方式.其属性值有五种,分别是 - stat ...
Spring事务配置的五种方式和spring里面事务的传播属性和事务隔离级别、不可重复读与幻读的区别
前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. spring事务配置的五种方式前段时间对Spring的事务配置做了比较深入的研究,在此之间对Spr ...
脏读、不可重复读共享锁、悲观锁和事务五种隔离级别
http://www.cnblogs.com/adforce/archive/2011/04/20/2021929.html 一.脏读.不可重复读.幻读 1.脏读:脏读就是指当一个事务正在访问数据,并 ...
position(五种属性，以及每个属性的特点)
1. position: relative;相对定位 1> 不影响元素本身特性(无论区块元素还是内联元素会保留其原本特性) 2> 不会使元素脱离文档流(元素原本位置会被保留,即改变位置也不 ...
html里position属性,科技常识：详解html中 position属性用法（四种）
今天小编跟大家讲解下有关详解html中 position属性用法(四种) ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关详解html中 position属性用法(四种) 的相关资料,希望小 ...

html position属性作用,position(五种属性，以及每个属性的特点)

html position属性作用,position(五种属性，以及每个属性的特点)相关推荐

最新文章

热门文章