ОБЯЗАТЕЛЬНО РАССКРЫТЬ АТРИБУТЫ

Метод 1: атрибут style

Применение CSS к HTML-документу.

Базовый синтаксис CSS

Как работает CSS

Подведем итоги

основные преимущества CSS:

· управление дизайном любого количества документов с помощью одной таблицы стилей;

· более точный дизайн страниц, поддерживаемый всеми браузерами;

· разделение документа на две составляющие: структура и дизайн, благодаря чему исходный код становится чистым и легко читаемым

· новые расширенные возможности по сравнению с обычным html

Многие свойства, используемые в Cascading Style Sheets (CSS), аналогичны свойствам HTML. Таким образом, если вы используете HTML для дизайна страниц, вы, наверняка узнáете многие коды. Посмотрим на следующих примерах.

Скажем, нам нужен красный цвет фона web-страницы:

В HTML это можно сделать так:

С помощью CSS того же самого результата можно добиться так:

body {background-color: #FF0000;}

Как видите, эти коды более или менее идентичны в HTML и CSS.

Есть три способа применить правила CSS к HTML-документу. Ниже мы рассмотри эти три метода.

Можно применять CSS к HTML с помощью HTML-атрибута style. Красный цвет фона можно установить так:

<body style="background-color: #FF0000;"> <p>This is a red page</p> </body>

Метод 2: Внутренний (тэг style)

Второй способ вставки CSS-кодов - HTML-тэг <style>. Например:

<html> <head> <title>Пример</title> <style type="text/css"> body {background-color: #FF0000;} </style> </head> <body> <p>Тут красная страница)))))</p> </body> </html>

Метод 3: Внешний (ссылка на таблицу стилей)

Рекомендуемый метод - создание ссылки на так называемую внешнюю таблицу стилей. Внешняя таблица стилей это просто текстовый файл с расширением .css. Вы можете поместить таблицу стилей на ваш web-сервер или на жёсткий диск, как и другие файлы.

Например, скажем, ваша таблица стилей называется styles.css и находится в папке lekcia_Belov. Это можно проиллюстрировать так:

Весь фокус состоит в том, чтобы создать ссылку из HTML-документа (index.htm) на таблицу стилей (styles.css). Это можно сделать одной строчкой HTML-кода:

Эту строку кода нужно вставлять в разделе header HTML, то есть между тэгами <head> и</head>. Например, так:

<head>

</head>

Эта ссылка указывает браузеру, что он должен использовать правила отображения HTML-файла из CSS-файла.
Самое важное здесь то, что несколько HTML-документов могут ссылаться на одну таблицу стилей. Иначе говоря, один CSS-файл можно использовать для управления отображением множества HTML-документов.

Это поможет вам сэкономить уйму времени и сил. Если вы, например, хотите изменить цвет фона web-сайта из 100 страниц, таблица стилей избавит вас от необходимости вручную изменять все сто HTML-документов. Используя CSS, эти изменения можно сделать за несколько секунд, просто изменив один код в центральной таблице стилей.