Введение
Веб-страница, содержащая полезную информацию и прошедшая логическую разметку,— обязательно найдет своего пользователя. Для ускорения этого процесса, для лучшей визуальной запоминаемости и комфортного чтения, страницу необходимо оформить. Строго говоря, веб-браузеры уже оформили страницу с применением стилей по умолчанию. Но нам-то нужен собственный неповторимый стиль...
Для оформления простейшей странички применим инструмент CSS (Cascading Style Sheets или «Стилевые таблицы»). При этом содержимое страницы не претерпит изменения, изменится лишь заголовок.
Внедрение СSS
Существует 3 способа внедрить стилевые таблицы:
- Непосредственно в тэге, используя атрибут style (inline)
- В заголовке страницы, используя тэг <style>
- В отдельном css-файле, используя тэг <link rel="stylesheet" href="style.css" type="text/css">
Так как в нашем распоряжении имеется только одна страница, используем второй вариант. На практике следует пользоваться 3-м способом, при котором css-файл будет кешироваться сервером и время загрузки будет сокращено. Ну, а 1-й вариант является палочкой-выручалочкой в особых случаях, а наш случай обычный.
Итак, внутри заголовка (<head>...</head>) пишем пару тэгов <style>...</style>.
Начинаем оформление по принципу «от крупного — к малому, сверху — вниз».
Тело
Самым крупным блоком, вмещающим в себе все остальные блоки, является тело документа (body).
По умолчанию, используется следующий стиль:
padding: 8px; line-height: 1.33
Добавим описание цвета фона и текста:
body { padding: 8px; line-height: 1.33; background-color:
white; color: black }
Определим текстовые ссылки:
a, a:link
{ color: green; text-decoration: underline; }
a:visited
{ color: olive; text-decoration: underline; }
a:active
{ color: fuchsia; text-decoration: underline; }
a:hover { text-decoration: none }