CSS/Применение CSS для HTML и XHTML: различия между версиями
Содержимое удалено Содержимое добавлено
Строка 37:
</source>
===
В динамически генерируемых страницах возможно придется использовать встроенные CSS, но это должно быть сведено к минимуму. Даже в динамических страницах любой CSS, является общим для нескольких страниц и как правило должны быть перемещены в связанный стиль.
Встроенные CSS являются CSS, которые находятся в заголовке HTML-документа, который требует укладки. Например, мы хотели бы, чтобы текст в этом HTML-документе был выделен полужирным шрифтом.
<source lang="html4strict">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<head>▼
<html lang="en">
▲ <head>
type="text/css"▼
<title>Example Web Page</title>
</head>
<
<p>
Text that will be formatted.
</p>
</body>
</html>
</source>
CSS должен быть помещен в раздел заголовка документа:
<source lang="html4strict">
<head>
<title>Example Web Page</title>
p {
font-weight:bold;
}
</style>
</head>
</source>
CSS содержится в <code>style</code> элементе. Установка элемента <code>type<code> атрибут <code>text/css</code> сообщает браузеру, что заключено sheetstyle написаного на CSS и должно быть использовано для форматирования страницы. Если атрибут <code>type<code> отсутствует или установлен в непризнанном значение, CSS не будет применен к странице.
Немного CSS в этом примере указывает браузеру, чтобы сделать весь текст находящийся в любом пункте (<code>p</code>) элемента выделен. Текст на странице будет выглядеть следующим образом:
{{CSS:rendered|1=<p style="font-weight:bold" title="This text is bold">Текст, который будет отформатирован.</p>}}
Вот полный текст документа, включающий CSS.
<source lang="html4strict">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Example Web Page</title>
<style type="text/css">
p {
font-weight:bold;
}
</style>
</head>
<body>
<p>
Текст, который будет отформатирован.
</p>
</body>
</html>
</source>
Помните, что вы должны использовать [[#связывание|связывание]] стилей предпочтенее по сравнению с встроенной таблицей стилей когда это возможно; это позволяет наиболее легче заменить общую информацию стиля без того, чтобы отслеживать стили в различных документах и файлах.
| |||