| Kosten | Пятница, 26 Июля 2019 | Сообщение 1 |
| Внешняя таблица стилей определяет, как изначально выглядит веб-страница на сайте. Вы можете использовать таблицу стилей, чтобы указать такие вещи, как размер, цвет и шрифт текста, цвет кнопок или положение меню и боковых панелей.
Код используемый во внешней таблице стилей
Существует два типа кода, используемого для создания базовой веб-страницы:
- Язык гипертекстовой разметки (HTML): определяет содержимое веб-страницы, где содержит фактический текст с разметкой, указывающий, являются ли разделы текста абзацами, заголовками или списками. Он также содержит ссылки на изображения, которые появляются на странице, и гиперссылки на внешние страницы.
- Каскадные таблицы стилей (CSS): язык кодирования, используемый для определения способа отображения содержимого, где определяет способ отображения каждого типа текстового элемента и может по-разному отображать один и тот же тип элемента, если они принадлежат к разным классам или имеют разные идентификаторы. Это позволяет таким вещам, как меню и списки, также вести себя по-разному в основном тексте веб-страницы.
В общем это хорошая идея отделить стиль от контента, поскольку он позволяет вам сосредоточиться на одной вещи за раз. Это становится еще более важным в команде, позволяя специалистам по содержанию и презентации работать независимо от остальных. Возможно еще важнее то, что он также позволяет применять единый набор инструкций по стилю на всем сайте.
Затем можно изменить визуальное представление веб-сайта из одной таблицы стилей без индивидуального редактирования каждой веб-страницы. Для больших сложных веб-сайтов можно использовать несколько таблиц стилей для управления текстом, меню и разделами на страницах.
Использование внешнего CSS для связи HTML с CSS
Можно включить стиль CSS непосредственно в HTML веб-страницы, используя CSS для индивидуального оформления каждого абзаца и заголовков по-разному. Этот тип встроенного стиля, как правило, не очень хорошая идея, поскольку вы теряете все преимущества отделения стиля от контента. В частности, вы теряете возможность последовательно обновлять весь веб-сайт из одного файла.
Правильный способ применить стиль к веб-сайту — это создать один файл внешней таблицы стилей для каждого типа стиля, который вы хотите применить, а затем ссылаться на эти файлы из каждого файла HTML. Например, у вас могут быть следующие внешние таблицы стилей:
text.css
menus.css
layout.css
Вы можете вносить изменения в код CSS в этих внешних таблицах стилей, не меняя их имен файлов, то есть ссылки на эти файлы в HTML всех ваших веб-страниц не будут изменены.
Примеры HTML и CSS
Очень простая HTML-страница может содержать следующий код:
Код <html> <head> <title>Моя удивительная страница</title> </head> <body> <h1>Все обо мне!</h1> <p>Эта страница обо мне и почему я потрясающая.</p> </body> </html>
Простую внешнюю таблицу стилей можно связать с этой страницей, добавив следующий код под строкой title:
Код <link rel = "stylesheet"type = "text/css" href = "myStyle.css" />
Создайте другой текстовый файл с именем myStyle.css, расположенный в той же папке, что и index.html, который содержит следующий код:
Код h1 {
color: #FF7643;
font-face: Arial'
}
p {
color: red;
font-size: 1.5em;
}
С помощью CSS вы можете сделать гораздо больше.
| | Страна: (RU) |
| |
