www.wmaster.ru
Wmaster.ru

На главную

Введение в дизайн

СТАТЬИ

Хостинг

DOCS

Коллекция шрифтов

Скрипты

Секреты мастеров

Продвижение сайта

Soft

Журнал Wmaster

Электронные журналы

ФоруМ

web-mastering
HTML
Programming
HTML-редакторы
Учебник по SEO
Apache
MySQL
XML/WML
Flash
Photoshop
.htaccess
Всё для форумов
Clipart
3DSMax
SSI
CSS
Технология раскрутки
Авторское право
Кодовые таблицы
Важное

Windows

Кое-что о расслоении (продолжение)
Продолжая тему, затронутую в предыдущей заметке, я приведу один пример из книги А.Хоумера "Dynamic HTML: справочник", которая сейчас активно продвигается издательством Piter-Press. Речь идет о совместимости шрифтов для браузеров NN и MSIE при использовании тега <DIV>.

Небезызвестный в моем городе вебмастер сервера jeo.ru в своем комментарии справедливо заметил, что Netscape понимает тег DIV в сочетании с CSS-позиционированием, но при этом теряются свойства шрифта. Однако, решить эту проблему оказалось довольно просто.

Рассмотрим пример создания рельефной надписи.

<html>
<head><title>3D title</title>
<style>
P { font-family: "Impact, sans-serif";
   font-size:96; color=red }
P.highlight { color:silver }
P.shadow { color:darkred }
</style>
<body bgcolor=#408080>
<div style="position:absolute; top:5; left:5; 
width:600; height:100; margin:10">
<P class=shadow>Be happy!</P>
</div>
<div style="position:absolute; top:0; left:0; 
width:600; height:100; margin:10">
<P class=highlight>Be happy!</P>
</div>
<div style="position:absolute; top:2; left:2; 
width:600; height:100; margin:10">
<P>Be happy!</P>
</div>
</body>
</html>

В Internet Explorer все выглядит именно так, как и было задумано, но вот в Netscape куда-то пропадают заданные свойства шрифта (размер и гарнитура).
Эта проблема касается только тех свойств, которые пишутся через дефис: font-size, font-family. Кроме того, Netscape требует, чтобы шрифты задавались по отдельности. Следовательно тег <STYLE> должен выгдядеть так:

P { fontfamily: "Impact", "sans-serif"; fontsize:96;
 color=red }

Правда такую конструкцию не понимает уже Internet Explorer. Для достижения совместимости, нужно создать универсальный набор стилей. В нижеследующем примере первая часть работает в обоих браузерах и определяет цвет шрифта, вторая задает свойства для NN и третья для MSIE.

<style>
P { color:red }
P { fontfamily: "Impact", "sans-serif"; fontsize:96 }
P { font-family: "Impact", "sans-serif"; font-size:96 }
P.highlight { color:silver }
P.shadow { color:darkred }
</style>

Все заметки: 1 2 3 4 5 6 7 8 9 11 12 оглавление

Партнеры Wmaster
Protoplex.RU
Эскизы татуировок
Поиск по сайту
Объявления
Twitter автора
Карта сайта
Наши баннеры
О проекте

Реклама
(понижение цен)

Об Авторе
Команда
Архив рассылки
 Запомнить эту страницу
Сделать стартовой
Рассылка
Wmaster.ru - всё для вебмастера.
Наша кнопка

Все желающие могут поставить нашу кнопочку к себе на сайт
Всё для веб-мастеров

Партнеры
Бочкарёв Антон
Mail: webmaster[at]wmaster.ru
ICQ: 148780826
Хостинг от Valuehost
© RUscripts.design 2003

© Wmaster Design Group 2001-2008. © Все права защищены. При перепечатке любого материала с сайта  ссылка на http://www.wmaster.ru/  обязательна.