Викиучебник

CSS/Применение CSS для HTML и XHTML: различия между версиями

Интерактивная навигация по истории
← Предыдущая правкаСледующая правка →
Содержимое удалено Содержимое добавлено
ВизуальныйВики-текст
Нет описания правки
уточнение перевода и викификация
Строка 1:
CSS может быть применён к HTML или XHTML с использованием трёх методов: связывание (linking), внедрение (embedding) и встраивание (inlining).
 
В связанном методе таблица стилей создаётся и хранится в отдельном файле с расширением css. Это связанные (или внешние) стили.
Строка 13:
== Связывание ==
 
CSS хранятся в отдельном файле. Для ссылки на этот файл с HTML-страницы используется тег <nowiki> <link> </nowiki> между тегами <nowiki> <head> </nowiki>, как показано в следующем примере, который предполагает, что таблица стилей хранится в файле с именем "«style.css"».
 
<source lang="html4strict">
Строка 22:
</source>
 
<code>link</code> элемент в примере состоит из трехтрёх атрибутов. Первый, <code>rel</code>, сообщает браузеру тип и цель ссылки. Второй, <code>type</code>, сообщает браузеру, какой тип стилей. И третий, <code>href</code>, сообщает браузеру URL, чтобы найти таблицу стилей. В этом примере URL является относительным, но он также может быть абсолютным.
 
"«style.css"» с одним правилом содержит только текст следующего содержания:
 
<source lang="css">
Строка 58:
В динамически генерируемых страницах возможно придётся использовать внедрённые (внутренние) CSS, но это должно быть сведено к минимуму. Даже в динамических страницах любой CSS является общим для нескольких страниц и как правило должнен быть перемещён в связанный (внешний) стиль.
 
Внедрёнными CSS являются CSSстили, которые находятся в заголовке HTML-документа, который требует стилизации. Например, мы хотели бы, чтобы текст в этом HTML-документе был выделен полужирным шрифтом.
 
<source lang="html4strict">
Строка 89:
CSS содержится в <code>style</code> элементе. Установка элемента <code>type<code> атрибут <code>text/css</code> сообщает браузеру, что внедрённый стиль написан на CSS и должен быть использован для форматирования страницы. Если атрибут <code>type<code> отсутствует или установлен в неправильное значение, CSS не будет применён к странице.
 
Немного CSS вВ этом примере стилевое правило <code>p{font-weight:bold;}</code> указывает браузеру, чтобы сделать весь текст находящийся в любом пункте (<code>p</code>) элементапараграфе жирнымполужирным. Текст на странице будет выглядеть следующим образом:
 
{{CSS:rendered|1=<p style="font-weight:bold" title="This text is bold">Текст, который будет отформатирован.</p>}}
 
Вот полный текст документа, включающий CSS.:
 
<source lang="html4strict">
Источник — https://ru.wikibooks.org/wiki/CSS/Применение_CSS_для_HTML_и_XHTML