css z-index属性

时间: 2019-09-23阅读: 97标签: 属性

z-index 属性用来控制元素在 z 轴上的顺序


1. 适用范围

z-index 仅适用于定位元素。即 postition 值为 relative, absolute 和 fixed 属性


2. 作用

指定当前元素的 堆叠顺序创建新的 堆叠上下文

2.1 什么是堆叠顺序

堆叠顺序是当前元素位于 z 轴上的值。值越大表示元素越靠近屏幕,反之元素越远离屏幕在同一个堆叠上下文中, z-index 值越大,越靠近屏幕。
除了 z-index 控制着元素的 堆叠顺序,还有其他因素控制着元素的 堆叠顺序,如下:
<img src="https://www.github.com/hileix/blogs/raw/master/src/assets/堆叠顺序.png">

2.1 什么是堆叠上下文?

堆叠上下文 是一个在该元素内的堆叠顺序不会影响到其他堆叠上下文堆叠顺序的一个 环境HTML 文档默认的堆叠上下文: html 元素


3. 其他

元素的堆叠顺序不会高于(或低于)父元素的堆叠顺序


吐血推荐

1.站长广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入...

2.休闲娱乐: 直播/交友    优惠券领取   网页游戏   H5游戏

链接: http://www.fly63.com/article/detial/7016

9个必知的CSS属性

如今的Web设计在不断跟进最新的开发技术,纷纷采用HTML5来开发多样性的Web应用。HTML5的优势之一,就是之前必须用图片实现的元素,现在可以用代码来实现

HTML5中的lang属性,zh-CN还是zh-Hans?

language:主语言,用代码“zh”表示汉语,小写。好像对于大小写没有强制要求,习惯而已。还是遵循习惯吧,总让别人看着别扭不是彰显个性的好办法

Vue 计算属性简析

Vue 开发人员必然使用过计算属性(Computed Properties):你可以像绑定 data 属性一样在模板中绑定计算属性;计算属性一般依赖一个或多个 data 属性,并返回它们复杂逻辑下的状态

html数据属性 data-*

在HTML标签中定义属性,需要时可以读取属性的值,这类属性称为数据属性;在JavaScript中读取时通过元素的dataset.<属性名称>访问,这样触发函数就能读取data-text的值

css3新增属性有哪些?

css3新增属性有哪些?来提问这个问题的人都应该知道css3是css的升级版本,那么,css3既然是升级版本,自然是会新增一些属性,接下来本篇文章将给大家介绍关于css3中常用的新增属性。

Vue之计算属性和侦听器

在Vue开发中,模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。当你想要在模板中多次引用相同表达式时,就会更加难以处理。所以,对于任何复杂逻辑,你都应当使用计算属性

Vue.js 计算属性

在html模版中绑定数据时,如果需要的数据不是一个简单的数据,而是需要将一个或者多个数据计算之后得到的数据,这时候就需要用到计算属性;使用方法:配置computed属性,它的值为对象

vue中计算属性的get与set方法

在vue的计算属性中,所定义的都是属性,可以直接调用,正常情况下,计算属性中的每一个属性对应的都是一个对象,对象中包括了set方法与get方法

CSS3的all属性

all属性实际上是所有CSS属性的缩写,表示,所有的CSS属性都怎样怎样,但是,不包括unicode-bidi和direction这两个CSS属性。为什么会有这个CSS属性呢?

CSS Display属性的双值写法

目前这个只有Firefox70支持了这一语法,其他的浏览器仍将其当成非法的语法处理,因此生产情况下使用还是为时过早。目前所有的功能都可以用单一值来实现,所以这个新的语法可能会作为别名的形式存在

fly63.com版权所有,内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权,请与小编联系!情况属实本人将予以删除!

文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全