Валидация, что это такое?

Так как HTML и XHTML определены стандартами (и CSS также, с этой целью), консорциум WWW (W3C) создал прекрасный инструмент, названный валидатором (validator) для автоматической проверки создаваемых страниц, и указания на любые проблемы/ошибки, которые может иметь код, такие как отсутствие закрывающих тегов, или отсутствие кавычек вокруг атрибутов. Валидатор HTML доступен в сети по адресу http://validator.w3.org/. Он автоматически определяет, используется ли HTML или XHTML, и какой тип документа используется. Если требуется проверить код CSS, то валидатор для этого доступен по адресу http://jigsaw.w3.org/css-validator/.

Дополнительную информацию о валидации можно найти в лекции 24. Дополнительная информация о типах документов находится в лекции 14.

Css - давайте добавим немного стиля

Каскадные таблицы стилей (CSS) обеспечивают точное управление форматированием и компоновкой документа. Можно изменять или добавлять цвета, фон, размер шрифта и стили и даже помещать объекты на странице Web в различных местах. Существует три основных способа использования CSS: переопределение тега, применение стиля к некоторому ID, или применение стиля к классу. Давайте посмотрим на каждый из них:

1. Переопределение элемента. Можно изменить способ, которым выводится любой элемент (X)HTML, определяя правило для его стилевого оформления. Если требуется, чтобы все параграфы были записаны через две строки и зеленым цветом, в CSS можно добавить следующее объявление:

2. p {

3. line-height: 2em;

4. color: green;

5. }

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

6. Определение ID. Можно задать для элемента атрибут id для уникальной идентификации его на странице (каждый ID может использоваться на странице только однажды) - например, id="navigation_menu". Это позволяет иметь более детальный контроль форматирования страницы, например, если вы хотите, чтобы только определенный параграф текста выводился через два интервала и зеленым цветом, задайте для него ID:

7. <p id="highlight">Контент параграфа </p>

И затем примените к нему правило CSS следующим образом:

#highlight {

line-height: 2em;

color: green;

}

Это позволяет применить правило CSS к параграфу на странице с атрибутом id, заданным как highlight (символ # является просто соглашением CSS для указания, что это ID).

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

9. <p class="highlight">Контент параграфа </p>

10. <p class="highlight">Контент второго параграфа </p>

И затем применим к ним правило CSS следующим образом:

.highlight {

line-height: 2em;

color: green;

}

highlight является в данном случае классом, а не ID - точка в начале является просто соглашением CSS для указания класса.

Пример ниже позволит лучше понять, как CSS оформляет HTML. Более подробно мы начнем рассматривать CSS в лекции 22.