04/06/2003 |
электронная рассылка
|
Выпуск#
36
|
|
ПОЛЕЗНЫЕ СОВЕТЫ
ВЕБ-ДИЗАЙНЕРУ
|
|
CSS |
Свечение краев (встраивание стиля).
Сегодня поговорим о встраивании стиля и с помощью этого приема применим фильтр "свечение краев". Встраивание стиля в документ подразумевает применение листов каскадных стилей непосредственно в теле документа, т.е. между тегами <body> и </body>. Применить таким образом стиль можно практически к любому объекту: таблице, форме, параграфу и т.д.
Для примера применим фильтр свечения для текста. Для этого поместим текст в таблицу и встроим в нее стиль.
В код страницы между тегами <body> и </body> нужно вставить
следующее:
<table border=0 style="filter:glow(color=red, strength=4)">
<tr><td>
<p>Ваш текст</p>
</td></tr>
</table>
|
Где glow- название фильтра,
а color- цвет свечения; strenght- размер свечения.
|
|
ИНТЕРActive |
Надпись перед закрузкой рисунка.
Скрипт, который выводит ваш текст с предупреждением перед загрузкой ресунка. В нашем примере это текст "Пожалуйста ждите. Идет загрузка", соответственно Вы можете поменять этот текст на любой другой. Также можно менять позицию надписи относительно верхнего и левого края браузера, для этого нужно изменить параметры стиля (в примере выделен жирным шрифтом) при помощи изменения значения дискрипторов top, left .
<HTML>
<HEAD>
<TITLE> </TITLE>
<script language=javascript>
<!--
function init()
{
if (navigator.appName == "Netscape")
{
layerRef="document.layers";
styleSwitch="";
}
else
{
layerRef="document.all";
styleSwitch=".style";
}
}
//-->
</script>
<style type="text/css">
#loading {position: absolute; z-index: 10; top: 20; left: 60; }
#done {position: absolute; visibility: hidden; z-index: 20; top: 40;}
</style>
</head>
</body onLoad="init();hideLayer('loading');showLayer('done');" leftmargin=30 marginwidth=50>
</script language=javascript>
<!--
function showLayer(layerName)
{eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="visible"');}
function hideLayer(layerName) { eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"'); }
//-->
</script>
<div id="loading">
<table width="455" height=523>
<tr><td align=center>
Пожалуйста ждите.<br>Идет загрузка...
</td></tr>
</table>
<div>
<div id="done">
<img src="ваша картинка.jpg" border=0>
</div>
</script>
</HEAD>
<BODY>
</BODY>
</HTML> |
|
|
#CoLors# |
Это примеры цветов и их шеснадцатеричный код.
A |
#808080
|
A |
#6B8E23
|
А |
#C71585
|
A |
#FFEFD5
|
A |
#2E8B57
|
A |
#6A5ACD
|
A |
#00FF7F
|
A |
#191970
|
|
Совет |
Настройка направления текста.
Тег <bdo> позволяет задать желаемое направление текста и имеет атрибут:
dirзадает направление текста значения:
ltr-направление текста слева направо
rtl-направление текста справа налево
Например: <bdo dir=rtl>текст заголовка</bdo>
|
|
Эдмон и Ирэн
Напоминаем, что в скриптах могут быть ошибки, о которых мы бы хотели, чтобы
вы сообщали.
Архив рассылки вы можете посмотреть на http://friends.pomorsu.ru/~admont/
Наш e-mail: web-design@hotmail.ru |