zIndex 属性设置元素的堆叠顺序。

http://www.w3school.com.cn/jsref/prop_style_zindex.asp

该属性设置一个定位元素沿 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>
时间: 2024-12-12 04:39:21

zIndex 属性设置元素的堆叠顺序。的相关文章

Z-Index属性——定义元素在页面中的层次

说明:设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴.如果为正数,则离用户更近,为负数则表示离用户更远. 注释:元素可拥有负的 z-index 属性值.Z-index 仅能在定位元素上奏效(例如 position:absolute;)! 可用的值: auto:默认.堆叠顺序与父元素相等. number:设置元素的堆叠顺序. inherit:规定应该从父元素继承 z-index 属性的值. 实例: <html> <head> <style type=&quo

css属性设置元素的垂直对齐方式

vertical-align 属性设置元素的垂直对齐方式. 可能的值 值 描述 baseline 默认.元素放置在父元素的基线上. sub 垂直对齐文本的下标. super 垂直对齐文本的上标 top 把元素的顶端与行中最高元素的顶端对齐 text-top 把元素的顶端与父元素字体的顶端对齐 middle 把此元素放置在父元素的中部. bottom 把元素的顶端与行中最低的元素的顶端对齐. text-bottom 把元素的底端与父元素字体的底端对齐. length   % 使用 "line-he

使用 CSS3 的 box-sizing 属性设置元素大小包含 border 与 padding

?  默认情况下,内部元素(如:input)的宽度或高度,是不会包含元素的边框和内边距的,这是就需要使用 box-sizing 属性设置该元素. ?  box-sizing 是 CSS3 的属性,可以设置以上值: 1.   content-box: 元素 size 不包含 border 和 padding,默认值. 2.   border-box: 元素 size 包含 border 和 padding. 3.   inherit: 指定box-sizing属性的值,应该从父元素继承. 1)  

vertical-align 属性设置元素的垂直对齐方式。

 值 描述 baseline 默认.元素放置在父元素的基线上. sub 垂直对齐文本的下标. super 垂直对齐文本的上标 top 把元素的顶端与行中最高元素的顶端对齐 text-top 把元素的顶端与父元素字体的顶端对齐 middle 把此元素放置在父元素的中部. bottom 把元素的顶端与行中最低的元素的顶端对齐. text-bottom 把元素的底端与父元素字体的底端对齐. length   % 使用 "line-height" 属性的百分比值来排列此元素.允许使用负值. i

html 中内容的堆叠顺序 设置

z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)! 如: <div id="menuContent" class="menuContent" style="display:none; position: absolute;z-index:5;">  

(一)学习CSS之z-index属性

参考:http://www.w3school.com.cn/cssref/pr_pos_z-index.asp z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!

css中z-index属性

定义和用法 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)! 说明 该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴.如果为正数,则离用户更近,为负数则表示离用户更远. 以下网址为实例: http://www.w3school.com.cn/tiy/t.asp?f=csse_zinde

CSS z-index 属性

浏览器支持 所有主流浏览器都支持 z-index 属性. 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit". 定义和用法 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!

W3School上关于css中Z-index属性的介绍

浏览器支持 所有主流浏览器都支持 z-index 属性. 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit". 定义和用法 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)! 说明 该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显