Листинг 10

< HTML>

< HEAD>

< META http-equiv=" Content-Type"

content=" text/html; charset=UTF-8" >

< TITLE> Z-индекс < /TITLE>

< /HEAD>

< BODY bgcolor=white text=brown" >

< H1> Z-индекс< /H1>

< P>

Этот текст& nbsp; & #151; основной. К нему не приписано никаких стилевых воздействий. Значит, этот текст лежит в нулевой плоскости.

< IMG src=kbtu.jpg width=126 height=60 border=0

alt=Университет align=left hspace=10

style=" position: absolute; left: 0px; top: 20px; z-index=-1; " >

< IMG src=kbtu.jpg width=126 height=60 border=0

alt=Университет align=left hspace=10

style=" position: absolute; left: 50px; top: 70px; z-index=-2; " >

< /BODY>

< /HTML>

Если у элементов одинаковый z-index (задан явно или не задан вовсе), то
тот из них будет располагаться выше, чей HTML-код идет позже.

Рис. 15.Z-index

Контрольные вопросы:

1. Что такое «позиционирование»?

2. Каким свойством CSS задается позиционирование элемента? Какие значения может принимать это свойство?

3. Какими стилевыми указаниями задаются координаты элемента в окне браузера?

4. Расскажите алгоритм, по которому выполняется абсолютное позицио­нирование.

5. Расскажите алгоритм, по которому выполняется относительное пози­ционирование.

6. Расскажите алгоритм выполнения смешанного позиционирования по схеме absolute [relative].

7. Расскажите алгоритм выполнения смешанного позиционирования по схеме relative [absolute].

8. Расскажите алгоритм выполнения смешанного позиционирования по схеме absolute [absolute].

9. Расскажите алгоритм выполнения смешанного позиционирования по схеме relative [relative].

10. Расскажите алгоритм вывода на экран элементов, обладающих стилевым
свойством z-index.