[Table]
Автор: Лещик Виталий[/Table]
[Table]
[Table]
Задание стилей внутри документа.
[/Table]
Первый и самый простой способ – задать стиль непосредственно в самом теге. Для этого используется атрибут style со списком свойств и их значений:
Code
<p style=”color:#005500; margin-left:30px; font-style:italic”>
Зелёный текст
...
</p>
Этот стиль будет действовать только на содержание данного тега. Такое включение стилей используется очень редко, т.к. для изменения дизайна придётся редактировать содержимое страницы.
Ещё один способ задания стилей – использование тега <style>. Эти стилевые правила будут действовать на весь документ. Тег <style> должен находиться внутри тега <head>.
Code
<html>
<head>
<title>CSS</title>
<style>
H1
{
text-align:center;
}
H2
{
color:green
}
</style>
</head>
<body>
<h1>Текст расположен в центре строки</h1>
<h2>Зелёный текст</h2>
</body>
</html>
[Table]
Подключение стилей из внешних файлов.
[/Table]
Это очень удобный и наиболее часто встречающийся способ. Его преимущества очевидны. При таком подходе нет необходимости при смене дизайна отдельно редактировать каждую страницу сайта. Подключить внешнюю таблицу стилей можно двумя способами.
Первый – использование тега <link> в нутрии тега <head>:
Code
<link rel="stylesheet" type="text/css" href="style.css">
Второй – применение директивы @import внутpи тeгa <style>. Она должна применяться до любых стилевых правил. Пример:
Code
<style>
@import url(style.css)
H1
{
color:red
}
P
{
margin-left:30px;
border:none
}
...
</style>
Второй способ имеет один недостаток: директива @import (не поддерживается старыми браузерами)[/Table]