×
Traktatov.net » Как сделать свой сайт и заработать на нем. Практическое пособие для начинающих по заработку в Интернете » Читать онлайн
Страница 30 из 98 Настройки

Рис. 3.17. Заголовок размещен по центру за счет атрибута align


Если сайт состоит из 1000 страниц, то подобные изменения придется вносить в заголовки каждой из них.

Может случиться так, что через некоторое время снова понадобится разместить заголовок по левому краю, а цвет сделать синим. В этом случае придется вновь править код 1000 страниц. Как вы понимаете, это крайне неудобно. По этой причине все параметры форматирования (изменения внешнего вида) страницы выгодней держать в так называемых каскадных таблицах стилей – CSS. В таблице стилей можно указать, каким образом должно форматироваться содержимое тех или иных тегов веб-страницы, после чего один-единственный файл со стилями можно подключить к 1000 страницам и таким образом изменить их форматирование. Иными словами, изменения в каскадной таблице стилей приведут к изменениям на всех веб-страницах, к которым она подключена.

Перед созданием каскадной таблицы стилей мы уберем все форматирование заголовка первого уровня, то есть вернем все к состоянию, изображенному на рис. 3.16. Каскадную таблицу стилей мы будем создавать с помощью все того же Блокнота. Откройте Блокнот и наберите код из листинга 3.3.

Листинг 3.3. Содержимое файла каскадной таблицы стилей

h1

{

text-align: center;

color: green;

font-style:italic;

}

Наша таблица стилей должна отформатировать заголовок первого уровня следующим образом:

• выравнивание: по центру;

• цвет: зеленый;

• начертание: курсив.

Созданную таблицу стилей необходимо сохранить подобно тому, как мы сохраняли веб-страницу, но указать расширение. css. В нашем случае мы сохранили файл под именем style.css.

Для того чтобы подключить каскадную таблицу стилей к веб-странице, добавим в код страницы ссылку на CSS: сразу перед закрывающим тегом . Код нашей страницы на этом этапе выглядит, как в листинге 3.4.

Листинг 3.4. Код веб-страницы с подключенной таблицей CSS

МФУ для дома

МФУ для дома

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

Совет

При создании или правке веб-страниц не ленитесь добавлять комментарии, так как в дальнейшем они помогут сэкономить время. Человек не в состоянии запомнить все, что он когда-то делал, поэтому комментарии дадут возможность освежить память. Если вы собираетесь удалять с веб-страницы большой фрагмент кода, но сомневаетесь в своих действиях, лучше «закомментируйте» этот фрагмент. Если понадобится вернуть все в исходное состояние, достаточно будет удалить теги комментариев.

МФУ для дома фото Ячейка 2
Ячейка 3 МФУ для дома фото

height="200">