Файл: work/css_teach/psv3.php
Строк: 68
<?
require '../../config.php';
$title = 'Учебник CSS';
include '../../style/head.php';
aut();
who_add(0, 'servise');
?><font color=red>Свойства элементов, управляемых с помощью CSS</font> <br />
Откроем наш любимый Web-редактор Notepad и создадим файл с будущим названием <span>style.CSS</span>
(название файла может быть любым). Опишем в этом файле стиль параграфа <span><P></span>,
который будет использоваться на всех страничках нашего сайта:<br />
<span>
P {
font-family: Times New Roman, serif;
color: #000000;
margin-left: 15%;
margin-right: 15%;
margin-top: 1pt;
margin-bottom: 1pt;
text-indent: 1cm;
text-align: justify;
}</span><br>
Внутри описания стиля для удобства форматирования вы можете использовать любое количество
пробелов и переносов строк – при чтении стиля броузер просто отбросит все лишние пробелы.
В этом стиле мы задали, что параграфы P на всех страничках, которые используют это описание,
будут отображаться шрифтом <span>Times New Roman</span> или в случае, если этот шрифт на машине не установлен,
другим шрифтом, но из этого семейства <span>(serif)</span>. Цвет шрифта мы установили черный, выравнивание –
полное (по обеим сторонам).<br />
Также мы установили для параграфа ряд значений отступов. Это было сделано со следующей целью:
по умолчанию параграф в HTML отображается равным практически 95 % страницы и с интервалами между
параграфами, равными <span>180 %</span> межстрочного интервала. Читать такие параграфы не очень удобно,
так как интервалы между ними слишком велики, а ширина параграфа слишком большая. Посмотрите на журнал,
который вы сейчас держите в руках: текст сверстан в колонки для того, чтобы его было удобнее читать.<br />
В стиле параграфа, который мы создали, установлены боковые отступы в <span>15 %</span> ширины окна и вертикальные
отступы в <span>1 пункт</span> – так текст статьи будет гораздо читабельнее.
Давайте так же создадим стиль для заголовков статей:<br />
<span>H2 {
font-family: Verdana, Arial Cyr, Arial;
font-weight: bold;
font-size: 14pt;
color: black;
margin-left: 20%;
margin-top: 1cm;
text-align: left;
}</span><br />
Все заголовки наших страниц, оформленные тегом <span>H2</span>, будут отображаться жирным шрифтом <span>Verdana</span> или,
если этот шрифт не установлен, шрифтом <span>Arial</span>. Размер заголовка мы установим равным <span>14 пунктам</span>, цвет черный,
отступ слева равен <span>20 %</span> ширины страницы, а отступ сверху – <span>1 см</span>. Заголовок будет выравниваться относительно
левого края страницы.
Благодаря тому, что боковые отступы заголовка и параграфа установлены нами в процентах от ширины окна
броузера, при просмотре наших страничек на компьютерах с разным разрешением дисплея пропорции и
расположение заголовка, основного текста и отступов будут сохранены.
Для того чтобы «привязать» созданные нами стили к нашим страничкам, во все html-файлы в разделе
<span>HEAD</span> мы должны поместить строку со ссылкой на файл стилей и с указанием об использовании CSS:<br />
<span><link rel="stylesheet" type="text/CSS" href="style.CSS"/></span><br />
Поскольку файл со стилями будет находиться в том же каталоге сервера, что и остальные странички,
параметр <span>HREF="URL"</span> в нашем случае будет просто именем нашего файла стилей (style.CSS).<br />
</div><div class="strik">
<a href="svsh.php">Свойства шрифта</a><br />
<div class="partners">
<a href="index.php">Назад</a><br />
<? include '../../style/foot.php' ?>