Что такое CSS?
Очень многие начинающие вебмастера не могут разобраться, что такое CSS и с чем его "едят". В этом разделе своего сайта я постараюсь максимально подробно "разжевать" и на примерах показать, как правильно работать с листами стилей. Сразу сделаю существенную оговорку - будут рассматриваться внешние листы стилей (впрочем, внешний лист стилей от внутреннего не сильно отличается).
CSS (Cascading Style Sheets - каскадные таблицы стилей) - мощное и удобное средство форматирования сайта. Бегло таблицы стилей уже рассматривались в ветке "HTML" - урок 23 (внутренний лист стилей) и урок 24 (внешний лист стилей).
Основная цель каскадных таблиц стилей - разделить содержимое веб-страницы (написанной, например, на HTML) и форматирование (представление) документа (CSS). Т.е., в коде html-страницы находится информация, которую видит пользователь, загрузив эту страницу в свой браузер. А вот то, в каком виде он видит эту информацию на своем экране - за это "отвечает" файл каскадной таблицы стилей.
Скорее всего, вы уже знаете, что файл стандартной html-страницы имеет название, скажем, index.html
Где:
index - имя файла;
html - расширение файла.
Именно расширение файла "говорит" браузеру ЧТО это за файл и как он с ним должен работать.
Файл каскадного листа стилей, обычно, имеет название style.css
Расширение css позволяет браузеру идентифицировать данный файл именно, как лист стилей, и интерпретировать его содержимое должным образом.
Как правило, один файл листа стилей "обслуживает" весь сайт. Располагается он в корневом каталоге сайта (там, где и главная страница сайта). Для подключения листа стилей в коде html-страницы должен быть прописан МЕТА-тег следующего содержания:
--- <link rel="stylesheet" href="style.css" type="text/css"> ---
Имя файла каскадного листа стилей и путь к нему указывается в атрибуте href. Будьте внимательны: следите за правильным путем к листу стилей (на разных страницах он может быть разным)! Можно использовать абсолютный путь:
--- <link rel="stylesheet" href="http://mysite.ru/style.css" type="text/css"> ---
Но, имейте ввиду, что при такой записи файл не будет работать без подключения к Интернету (в локальном режиме).
Собственно вся "прелесть" использования внешнего листа стилей заключается в том, что вся информация о форматировании ВСЕГО сайта находится в одном файле! Нетрудно догадаться, что, поменяв пару-тройку строчек в файле style.css, ВЕСЬ сайт мгновенно преображается, реагируя на изменения. Понимаете теперь, какой это мощный и гибкий инструмент "причесывания" вашего сайта?!