
- •Тема 5: «использование иерархических стилевых спецификаций (css)»
- •Применение css
- •Внешняя стилевая спецификация
- •Внедренные стилевые таблицы
- •Внутренние стили
- •Классы в стилевых спецификациях
- •Определение стиля для специфического элемента
- •Работа со специальными элементами
- •Изучение свойств таблиц стилей
Изучение свойств таблиц стилей
Требование: при выполнении ниже приведенных заданий в html-документах не должно быть локального форматирования. Все оформление должно быть сделано через таблицу стилей
Задание 9
В справочнике Sprav_CSS.doc изучить свойства категории background.
Создать web-страницу, на которой должны быть блоки, как изображено на рис. 7, 8, 9. Все материалы (тексты, картинки находятся в папке ЛР_CSS).
Сохранить файл под именем background.html
Рис. 7
Рис. 8
Рис. 9
Задание 10
В справочнике Sprav_CSS.doc изучить свойства категории border.
Создать web-страницу, как изображено на рис. 10. Сохранить файл под именем border.html
Рис. 10
Задание 11
В справочнике Sprav_CSS.doc изучить свойства категории margin.
Создать web-страницу, как изображено на рис. 11, 12. Сохранить файл под именем margin.html
Рис. 11
Рис. 12
Задание 12
В справочнике Sprav_CSS.doc изучить свойства категории padding.
Создать web-страницу, как изображено на рис. 13. Сохранить файл под именем padding.html
Рис. 13
Задание 13
В справочнике Sprav_CSS.doc изучить свойства категории float и clear.
Создать web-страницу, как изображено на рис. 14, 15. Сохранить файл под именем float.html
Рис. 14
Рис. 15
Задание 14
Используя полученные выше знания, создать web-страницу, как изображено на рис. 16. Сохранить файл под именем itog.html
Рис. 16
Задание 15
В справочнике Sprav_CSS.doc изучить свойства категории list-style и font.
Создать web-страницу, как изображено на рис. 17, 18, 19. Сохранить файл под именем list.html
Рис. 17
Рис. 18
Рис. 19
Контрольные вопросы
Какие существуют методы применения каскадных таблиц стилей?
Нужен ли тег <STYLE> и </STYLE> при создании внешней таблицы стилей? Внедренной таблицы стилей?
Как связывается конкретная Web-страница с конкретной внешней таблицей стилей?
В чем состоит удобство использования стиля специфического элемента?
Какие способы определения стиля гиперссылок Вы знаете?
Что означает термин «иерархические» в названии «иерархические стилевые спецификации»?
Приоритет какого из изученных типов стилевых спецификаций самый высокий?
Корпоративные цвета фирмы, заказавшей Вам сайт, ‑ оливковые. Но оформление прайса продукции фирмы, согласно требованию заказчика, требует использования черно-белой гаммы. Кроме того, временно отсутствующая продукция в прайсе должна отображаться шрифтом красного цвета. Какой будет структура иерархической стилевой спецификации этого сайта?
Одна из страниц сайта должна быть представлена текстовой информацией. Для абзацев этой страницы необходимо предусмотреть четыре варианта оформления. Какой вариант описания стиля является оптимальным для решения этой задачи?
Внешняя стилевая спецификация содержит следующее правило:
P {font-size:”12pt”; font-family:”Arial”; color:”#0000ff”;}.
На одной из страниц сайта используется внедренная стилевая спецификация, которая содержит следующее правило;
P {font-size:”18pt”; font-family:”Times New Roman”;}
Каким будет цвет шрифта этой страницы?