css z-index property


  Translation results：

index

UK[ˈɪndeks] US[ˈɪnˌdɛks]

n.index;<number>index;indication;sign

vt.Index...;Index...;[Economics] Adjust according to living index (wages, prices, etc.)

vi.[Mechanics]Transposition

css z-index propertysyntax

Function: z-index attribute sets the stacking order of elements. Elements with a higher stacking order will always appear in front of elements with a lower stacking order.

Description: This property sets the position of a positioned element along the z-axis, which is defined as the axis extending vertically to the display area. If it is a positive number, it is closer to the user, and if it is a negative number, it is further away from the user.​

Note: All major browsers support the z-index attribute. The attribute value "inherit" is not supported in any version of Internet Explorer (including IE8). Elements can have negative z-index attribute values. Z-index only works on positioned elements (e.g. position:absolute;)!

css z-index propertyexample

<html>
<head>
<style type="text/css">
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<img src="http://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg" />
<p>由于图像的 z-index 是 -1，因此它在文本的后面出现。</p>
</body>
</html>
Run instance »

Click the "Run instance" button to view the online instance

Popular Recommendations

Home

Videos

Q&A

submit