Файл: work/css_teach/psv2.php
Строк: 64
<?
require '../../config.php';
$title = 'Учебник CSS';
include '../../style/head.php';
aut();
who_add(0, 'servise');
?><font color=red>Свойства элементов, управляемых с помощью CSS </font><br/></div><div>
<span><HEAD></span><br>
<span><STYLE type="text/CSS"></span><br>
<span><!--
описания стилей
-- ></span><br>
<span></STYLE></span><br>
<span></HEAD></span><br>
где<br>
<span><!--</span> – тег, открывающий комментарий, а
<span>></span> – закрывающий.<br />
Устаревшие броузеры посчитают все заключенное между тегами комментариев информацией неотображенной,
а новые и сообразительные броузеры определят, что это — описание стилей, и задействуют их.<br />
Еще один из интересных вариантов применения CSS скрывается за, казалось бы, простой возможностью:
вы можете указывать значения отступов вокруг объектов, как отрицательные величины! Это позволяет накладывать
один слой текста на другой и получать весьма интересные и привлекательные результаты.
Добиться такого эффекта не очень сложно, давайте попробуем создать страничку с заголовком, который будет
выглядеть трехмерным, но не будет использовать графику.<br>
Создадим новый html-файл и составим описание стилей для трех объектов:<br />
<span><HEAD></span><br />
<span><STYLE type="text/CSS"></span><br>
<span>BODY {font-family: Verdana; font-size: 70pt; font-weight: bold;}</span><br />
<span>.z1 { color: silver; margin-top: 100px; margin-left: 70px;}</span><br />
<span>.z2 {color: navy; margin-top: -118px; margin-left: 68px;}</span><br >
<span></STYLE></span><br />
<span></HEAD></span><br />
В этом описании мы присвоили <span><BODY></span> (впрочем, это мог быть практически любой другой тег) размер,
шрифт и начертание – в таком стиле будут отображаться все элементы страницы. Это было сделано лишь ради
стремления уменьшить размер файла странички, вместо этого можно было описать эти параметры дважды: для
каждого из классов <span>z</span>.<br />
Далее мы описываем два стиля, которые отличаются цветом и размером отступов вокруг
них: нижний слой описывается стилем <span>z1</span>, а верхний – <span>z2</span>. Используя отрицательные значения отступов и
подбирая нужное значение, мы добиваемся того, что верхний слой как бы наползает на предыдущий...<br>
<span><BODY bgcolor=white></span><br />
<span><DIV class="z1">EC-NET</DIV></span><br />
<span><DIV class="z2">EC-NET</DIV></span><br />
<span></BODY></span><br />
</div><div class="strik">
<a href="psv3.php">Далее</a><br />
</div>
<div class="partners">
<a href="index.php">Назад</a><br /></div>
<? include '../../style/foot.php' ?>