CSS: Внутренняя таблица стилей
Внутренняя таблица стилей
Внутренняя таблица стилей - набор стилей, который является частью кода веб-страницы, которая всегда должна находиться внутри элемента <style>
в теле тега <head>:
<head> <style> hr { color: sienna; } p { margin-left: 20px; } body { background-image: url("images/back40.gif"); } </style> </head>
Тег <style> сообщает браузеру, что данные, располагающиеся внутри, являются кодом CSS. Такие таблицы стилей являются не самым лучшим способом для проектирования дизайна сайта, состоящего из большого количества страниц. Во-первых, такой код придется копировать и вставлять в каждую страницу, а еще труднее будет потом это все редактировать при каких-либо новых изменениях. Во-вторых, каждый такой вставленный код во много раз увеличивает размер кода на странице в целом, в следствии чего, страница будет дольше загружаться для просмотра.
Совет: если веб-страница имеет внутреннюю таблицу стилей, а вы хотите использовать внешнюю таблицу стилей, то всего лишь вырежьте CSS-код, расположенный между тегами <style>
(без самих тегов). Потом создайте новый текстовый документ и вставьте в него CSS-код. Сохраните файл с расширением .css
, например styles.css
, и подключите его к вашей веб-странице, используя тег <link> или правило @import
.
Встроенный стиль
Под встроенным стилем подразумевается использование глобального атрибута style
непосредственно в том элементе, который необходимо стилизовать. В качестве значения атрибута указываются CSS-свойства:
<div style="border: 1px solid red; background-color: yellow;">Элемент div</div>
Минус от использования встроенных стилей заключается в том, что они создают дополнительные неудобства: смешивается структура документа с его стилизацией, поиск и правка таких стилей занимает достаточно много времени.
Примечание: встроенный стиль используется в тех редких случаях, когда необходимо определить стиль только для одного элемента, и нет более удобного способа это сделать. Тем не менее, почти всегда можно избежать применение встроенного стиля, добавив к нужному элементу уникальный идентификатор или класс.
С этой темой смотрят: