zIndex 属性设置元素的堆叠顺序。
http://www.w3school.com.cn/jsref/prop_style_zindex.asp
zIndex 属性设置元素的堆叠顺序。
该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴。如果为正数,则离用户更近,为负数则表示离用户更远。
语法:
Object.style.zIndex=auto|number
可能的值
| 值 | 描述 |
|---|---|
| auto | 默认。堆叠顺序与父元素相等。 |
| number | 设置元素的堆叠顺序。 |
提示和注释
注释:元素可拥有负的 z-index 属性值。
注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!
实例
本例改变元素的堆叠顺序:
<html>
<head>
<style type="text/css">
#img1
{
position:absolute;
left:0px;
top:0px;
z-index:-1
}
</style>
<script type="text/javascript">
function changeStackOrder()
{
document.getElementById("img1").style.zIndex="1";
}
</script>
</head>
<body> <h1>This is a Heading</h1> <img id="img1" src="bulbon.gif" width="100" height="180"> <p>Default z-index is 0. Z-index -1 has lower priority.</p> <input type="button" onclick="changeStackOrder()"
value="Change stack order" /> </body>
</html>
zIndex 属性设置元素的堆叠顺序。的更多相关文章
- CSS border-right-style属性设置元素的右边框样式
CSS border-right-style属性设置元素的右边框样式 边框的样式指的是边框的线条属性,指的是边框采用的是实线效果.短线效果还是其它的线条效果. border-right-style属性 ...
- 使用 CSS3 的 box-sizing 属性设置元素大小包含 border 与 padding
Ø 默认情况下,内部元素(如:input)的宽度或高度,是不会包含元素的边框和内边距的,这时就需要使用 box-sizing 属性设置该元素. Ø box-sizing 是 CSS3 的属性,可以 ...
- draggable属性设置元素是否可拖动。
设置标签属性draggable="true"将一个标签内的元素拖动到另外一个标签进行显示: <!DOCTYPE HTML> <html> <head& ...
- vertical-align 属性设置元素的垂直对齐方式。
值 描述 baseline 默认.元素放置在父元素的基线上. sub 垂直对齐文本的下标. super 垂直对齐文本的上标 top 把元素的顶端与行中最高元素的顶端对齐 text-top 把元素的顶 ...
- CSS z-index 属性
定义和用法 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏 ...
- (一)学习CSS之z-index属性
参考:http://www.w3school.com.cn/cssref/pr_pos_z-index.asp z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元 ...
- css中z-index属性(标签层叠次序)
定义和用法 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏 ...
- 【CSS学习】--- z-index属性
一.前言 网页显示实际上是三维的,我们直观看到的有x轴和y轴,但在网页布局上还有一个z轴. 对于定位元素,我们使用top.right.left.bottom来实现元素在x-y平面上的定位,但为了表示布 ...
- CSS z-index 属性的使用方法和层级树的概念
之前有一篇文章提到过z-index,我们知道只有在元素设置了position部位static时才生效,而且z-index也跟父元素有关系,今天就在ie7遇到类似问题,在网上查了一些资料,发现一篇好文章 ...
随机推荐
- win10 git 报错 Host key verification failed
从code.aliyun.com切回github 原先的known_hosts里记录的是code.aliyun.com的ip,必须新加一个github的. known_hosts报错Host key ...
- 数独高阶技巧入门之六——ALS
在这个系列的第一篇(链及其简单应用)以及第四篇(简单异数链)中已经简单介绍过ALS结构的定义,即n格中存在n+1个不同的候选数 (双值格可视为特殊的ALS结构) .根据数独规则,在组成ALS的候选数 ...
- 基于ZKEACMS的.Net Core多租户CMS建站系统
多租户架构 多租户技术或称多重租赁技术,简称SaaS,是一种软件架构技术,是实现如何在多用户环境下共用相同的系统或程序组件,并且可确保各用户间数据的隔离性.简单讲:在一台服务器上运行单个应用实例,它为 ...
- 微软 eshop 数据存储之sqlserver
微软的eshop项目写的很牛,学起来也比较吃力,最近公司刚好有一本书,说的就是.NET微服务,记下来. 因为微软对性能的要求,docker里面要有内存要求 安装dokcer,拉镜象 : docker ...
- ES_HEAD基本查询操作
一.基本查询操作 选择索引 设置type查询条件 搜索 操作说明如图: 二.must, must not,should的区别 must 返回的文档必须满足must子句的条件 ...
- on where having总结
1. ON 和WHERE 所有的查询都回产生一个中间临时报表,查询结果就是从返回临时报表中得到.ON和WHERE后面所跟限制条件的区别,主要与限制条件起作用的时机有关, ON根据限制条件对数据库记录进 ...
- pageadmin网站制作 如何修改和管理网站模板
在使用pageadmin CMS 的同时,遇到问题可以参考官网帮助中心.1.网站模板目录地址/templates目录, 2.点击展开后,每个目录就是一个网站模板, 前端设计师制作的新版本都可以放到这个 ...
- 在linux 创建网络会话和绑定两块网卡
1. 如果我们在公司网络中要手动指定网络的IP地址,当我们回到家里则是使用DHCP(动态主机配置协议)自动分配IP地址.这就有点麻烦了,因为要频繁的修改IP地址,所以接下来我们来创建网络会话----- ...
- OCP 12c最新考试原题及答案(071-6)
6.(4-21) choose the best answer: View the Exhibit and examine the structure of the CUSTOMERS table. ...
- 手把手教你在Mac中搭建iOS的 React Native环境
准备工作 1.你需要一台Mac电脑..(这不是废话?我所用的是Air~~穷..) 2.我所操作的电脑系统环境是 3.xcode版本:8.0正式版 必需的软件 1.Homebrew Homebrew, ...