Что такое внешняя таблица стилей?

Когда веб-браузер загружает веб-страницу, то, как она выглядит, определяется информацией из каскадной таблицы стилей. Существует три способа использования таблицей стилей в HTML-файле: внешне, внутренне и встроенно.

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

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

Один или несколько документов могут ссылаться на один и тот же файл CSS, а на веб-сайте может быть много уникальных файлов CSS для оформления различных страниц, таблиц, изображений и т. Д.

Как сделать ссылку на внешнюю таблицу стилей

Каждая веб-страница, которая хочет использовать определенную внешнюю таблицу стилей, должна ссылаться на файл CSS из раздела , примерно так:

 


В этом примере единственное, что нужно изменить, чтобы применить его к вашему собственному документу, – это текст styles.css . Это местоположение вашего файла CSS.

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

Если файл CSS находится не в корне этой папки, а в подпапке, он может прочитать что-то вроде этого:

 


Дополнительная информация о внешних файлах CSS

Самым большим преимуществом внешних таблиц стилей является то, что они не привязаны к какой-либо конкретной странице. Если стилизация выполняется внутренне или встроенно, другие страницы на сайте не могут указывать на эти настройки стилизации.

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

Вы можете увидеть, как это работает ниже …

Внутреннее оформление требует использования тегов , поскольку их необходимо отличать от тегов :

 

цвет кузова {
цвет фона: зеленый;
}
h1 {
цвет: синий; < br /> поле слева: 15px;
}


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

 тело {
цвет фона: зеленый;
}
h1 {
цвет: синий;
поле слева: 15px;
} < br />

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

Оцените статью
Solutics.ru
Добавить комментарий