АВТИ. Лабораторные работы. 8 семестр / WebApplication1 / HtmlPage4

 СЛОИ #leftcol { position: absolute; /* Абсолютное позиционирование */ width: 550px; /* Ширина левой колонки */ background: #e0e0e0; /* Цвет фона содержимого */ padding: 10px; /* Поля вокруг текста */ } #rightcol { /* Этот слой накладывается поверх */ position: relative; /* Относительное позиционирование */ left: 500px; /* Положение от левого края */ top: 20px; /* Положение от верхнего края */ width: 200px; /* Ширина правой колонки */ background: #800000; /* Цвет фона */ color: #fff; /* Цвет текста */ } #layer1, #layer2, #layer3 { position: relative; /* Относительное позиционирование */ } #layer1 { margin:70px; font-size: 30px; /* Размер шрифта в пикселах */ color: #fff; /* Синий цвет текста */ width: 200px; /* Ширина правой колонки */ background: #800000; /* Цвет фона */ height: 500px; } #layer2 { top: -500px; /* Сдвигаем текст вверх */ left: 125px; /* Сдвигаем текст вправо */ color: #fff; /* Оранжевый цвет текста */ font-size: 30px; /* Размер шрифта в пикселах */ width: 200px; /* Ширина правой колонки */ background: #000; /* Цвет фона */ height: 500px; } #layer3 { top: -920px; /* Сдвигаем текст вверх */ left: 190px; /* Сдвигаем текст вправо */ color: #fff; /* Оранжевый цвет текста */ font-size: 30px; /* Размер шрифта в пикселах */ width: 200px; /* Ширина правой колонки */ background: #808000; /* Цвет фона */ height: 500px; } #layer1 { z-index: 1; } #layer2 { z-index: 2; } #layer3 { z-index: 3; } Левая колонка Правая колонка Слой 1 Слой 2 Слой 3