Задание 8. Примените 2-х колоночный макет с резиновой шириной и навигацией слева

Лабораторная работа №9

Блочная верстка. Создание макетов

Задание 1. Изучение блочной верстки

Самостоятельно изучите материал по ссылке https://htmlbook.ru/samlayout/blochnaya-verstka

Задание 2. Изучение вариантов макетов

Самостоятельно изучите варианты макетов по ссылке https://htmlbook.ru/layout

Задание 3. Придумать собственный тематический сайт из 4-5 страниц

Контент (содержимое и тематику) придумать и оформить самостоятельно. Использовать 2-х колоночный вариант: одна колонка для контента, другая – для навигации.

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

Задание 4. Примените 2-х колоночный макет с фиксированной шириной и навигацией слева

Для этого создайте отдельный стилевой файл, разместите в нем все необходимые стилевые правила и подключите его во все созданные страницы. Ширины подберите самостоятельно.

Используя псевдоклассы: visited,: link,: hover и: active, настроить отображение ссылок навигации.

Проверьте правильность работы ссылок и единство стиля на всех страницах.

Задание 5. Примените 2-х колоночный макет с фиксированной шириной и навигацией справа (использовать float)

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

Проверьте правильность работы ссылок и единство визуального стиля на всех страницах.

Задание 6. Примените 2-х колоночный макет с фиксированной шириной и навигацией справа (использовать float и margin)

Для этого создайте другой стилевой файл (css), разместите в нем все необходимые стилевые правила и подключите его во все созданные страницы, при этом контент менять не нужно! Ширины подберите самостоятельно.

Проверьте правильность работы ссылок и единство визуального стиля на всех страницах.

Задание 7. Примените 2-х колоночный макет с фиксированной шириной и навигацией справа (использовать позиционирование)

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

Проверьте правильность работы ссылок и единство визуального стиля на всех страницах.

Задание 8. Примените 2-х колоночный макет с резиновой шириной и навигацией слева

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

Проверьте правильность работы ссылок и единство визуального стиля на всех страницах.

Задание 9. Примените 2-х колоночный макет с резиновой шириной для контента и фиксированной шириной для навигации (слева или справа на выбор)

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

Проверьте правильность работы ссылок и единство стиля на всех страницах.