LAB7 Логинов А. А. (544755)

Просмтор этого файла доступен только зарегистрированным пользователям. Но у нас супер быстрая регистрация: достаточно только электронной почты!

Текст из файла

Национальный исследовательский университет

Московский Энергетический Институт

Лабораторная работа №7.

Использование слоев.

Выполнил: Логинов Андрей

группа А-13-08

Преподаватель: Куриленко Иван Евгеньевич

Москва, 2012.

Цель работы:

Научиться использовать слои при форматировании текста.

Подготовка к работе:

1. Ознакомиться с способом организации и отображения слоев в HTML

2. Ознакомиться с стилями, применимыми к слоям

3. Ознакомиться с моделью позиционирования слоев

Порядок выполнения работы:

1. Разработать страницу, содержащую слои

2. Реализовать наслоение изображений (по принципу колоды карт) с помощью слоев и настройки Z-индексов. Задание определить по номеру в журнале.

Элемент является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого. Как правило, вид блока управляется с помощью стилей.

Как и при использовании других блочных элементов, содержимое тега всегда начинается с новой строки. После него также добавляется перенос строки.

Любые позиционированные элементы на веб-странице могут накладываться друг на друга в определенном порядке, имитируя тем самым третье измерение, перпендикулярное экрану. Каждый элемент может находиться как ниже, так и выше других объектов веб-страницы, их размещением по z-оси и управляет z-index. Это свойство работает только для элементов, у которых значение position задано как absolute, fixed или relative.

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

"http://www.w3.org/TR/html4/strict.dtd">

Лаб. 7

Слой 1

Слой 2

Слой 3

Стили:

* {

margin: 0;

}

body {

font-size: 20px;

font-family: Arial

}

.div1 {

width: 120px;

height: 120px;

position: absolute;

top: 100px;

left: 50px;

z-index: 1;

background-color: silver;

padding: 3px

}

.div2 {

width: 120px;

height: 120px;

position: absolute;

top: 50px;

left: 120px;

z-index: 2;

background-color: red;

padding: 3px

}

.div3 {

width: 120px;

height: 120px;

position: absolute;

top: 0;

left: 190px;

z-index: 3;

background-color: green;

padding: 3px

}

img {

width: 550px

}

.div4 {

position: absolute;

top: 340px;

left: 50px;

z-index: 1

}

.div5 {

position: absolute;

top: 170px;

left: 350px;

z-index: 2

}

.div6 {

position: absolute;

top: 0;

left: 650px;

z-index: 3

}

Характеристики

Тип файла документ

Документы такого типа открываются такими программами, как Microsoft Office Word на компьютерах Windows, Apple Pages на компьютерах Mac, Open Office - бесплатная альтернатива на различных платформах, в том числе Linux. Наиболее простым и современным решением будут Google документы, так как открываются онлайн без скачивания прямо в браузере на любой платформе. Существуют российские качественные аналоги, например от Яндекса.

Будьте внимательны на мобильных устройствах, так как там используются упрощённый функционал даже в официальном приложении от Microsoft, поэтому для просмотра скачивайте PDF-версию. А если нужно редактировать файл, то используйте оригинальный файл.

Файлы такого типа обычно разбиты на страницы, а текст может быть форматированным (жирный, курсив, выбор шрифта, таблицы и т.п.), а также в него можно добавлять изображения. Формат идеально подходит для рефератов, докладов и РПЗ курсовых проектов, которые необходимо распечатать. Кстати перед печатью также сохраняйте файл в PDF, так как принтер может начудить со шрифтами.

Список файлов лабораторной работы