Свойство Z-index
Свойство z-index описывает уровень стека элементов на странице. Чем больше значение, тем выше элемент располагается поверх других.
Пример использования:
<style>
.logo { position:absolute; font-family:Century; font-size:2em; font-weight:bold; z-index:20; }
#logo1 { left:50px; top:50px; color:#00f; }
#logo2 { left:52px; top:52px; color:#f00; z-index:10; }
.box { position:absolute; height:100px; width:100px; border:15px solid #000; }
#box1 { left:150px; top:150px; border-color:#f00; z-index:40; }
#box2 { left:185px; top:185px; border-color:#00f; z-index:30; }
#box3 { left:185px; top:150px; border-color:#060; z-index:20; }
#box4 { left:150px; top:185px; border-color:#f60; z-index:10; }
</style>
Элементы с большим z-index будут отображаться поверх элементов с меньшим значением.
Свойство Display
Свойство display управляет тем, как элемент отображается:
blockinlinenone
Пример: превращение ссылок в блочные элементы:
a { display:block; padding:6px 4px; margin:4px; background-color:#eaf1dd; color:#060; text-decoration:none; }
Свойство Visibility
Свойство visibility управляет видимостью элемента:
visible— элемент виден;hidden— элемент скрыт, но занимает место на странице.
В отличие от display:none, скрытый элемент с visibility:hidden всё еще влияет на раскладку.
← Свойство Display | Встроенные, внутренние и внешние стили →