Пример
Устанавливает z-index изображения:<html>
<head>
<meta charset="utf-8" />
<style>
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
</style>
</head>
<body>
<h1>Это заголовок</h1>
<img src="/images/xhtml-css.png" width="130" height="102" alt="img" />
<p>Так как изображение имеет z-index равный -1, оно будет расположено позади текста.</p>
</body>
</html>
Определение и использование
Свойство z-index определяет порядок стека элемента.
Элемент с более высоким порядком стека всегда распологается во фронте элемента с более низким порядком стека.
Примечание: z-index работает только на позиционируемые элементы (position:absolute, position:relative, или position:fixed).
| Значение по умолчанию: | auto |
|---|---|
| Унаследованный: | нет |
| Версия: | CSS2 |
| Синтакс JavaScript: | object.style.zIndex="1" |
Поддержка браузеров
Свойство z-index поддерживается во всех ведущих браузерах.
Примечание: Значение "inherit" не поддерживается в IE7 и более ранних версиях. IE8 требует !DOCTYPE. IE9 поддерживает "inherit".
Значения свойства
| Значение | Описание | Играйте |
|---|---|---|
| auto | Устанавливает порядок стека равный родительскому. Это по умолчанию | Играйте » |
| number | Устанавливает порядок стека элемента. Возможны отрицательные значения | Играйте » |
| inherit | Указывает, что значение свойства z-index должно быть унаследовано от родительского элемента |
Была ли эта информация полезной?
