Значит стокнулся с парочкой проблем использования css: вобщем задача - мне нужно сделать заголовок <H1></H1> но что-бы шрифт и рамер были другими (а теги оставались открытыми), так же мне необходимо что бы если пользователь по своему усмотрению меняет в браузере величину шрифта "Большой" "Огромный" ит.д. мой заголовок соответственно увеличивался или уменьшался, для этого я использую цсс и прописываю там "H1 {color:white; font-family:Arial; font-size: 16pt}" таким образом у меня красивый заголовок все как нужно, НО при смене размеров шрифтов в браузере он остается статичен (как был размер 16 так и остался, хоть "суперогромный" шрифт ставь).
Вопрос - что я сделал не правильно и как мне заставить шрифт быть т.с. резиновым (для пользователя).

И еще вопрос ! Кроме как вышеописанным способом какнибудь еще можно заставить тескст или ссылки быть статичными (чтоб они в любом случае не меняли размера).

1. font-size: xx-small|x-small|small|medium|large|x-large|xx-large|smaller|larger
2. font-size: 140%
3. font-size: 0.8em - относительно высоты текущего шрифта.
4. font-size: 1.1ex - относительно высоты буквы "x" текущего шрифта.

Это сообщение отредактировал(а) dm9 - 29.9.2004, 21:10

Гость_ErAseR
Используем JavaScript, пишем функцию:

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN"> <html> <head> <style id="normalStyle" type="text/css"> body {font-family:Verdana, Helvetica, sans-serif;      font-size:small} #textSizer {text-align:right; display:none} .textSize {border:1px solid black} </style> <style id="sizer" type="text/css" disabled="disabled">    @import url("textSizer.css"); </style> <style id="smallStyle" type="text/css" disabled="disabled">    @import url("smallFont.css"); </style> <style id="largeStyle" type="text/css" disabled="disabled">    @import url("largeFont.css"); </style> <script type="text/javascript"> // вкл/выкл function setSizeStyle() {    if (document.getElementById) {        document.getElementById("sizer").disabled = false;                    var styleIDs = ["smallStyle", "largeStyle"];        for (var i = 0; i < styleIDs.length; i++) {                document.getElementById(styleIDs[i]).disabled = true;            }    } } setSizeStyle(); // меняем стиль function changeSizeStyle(styleID) {    setCookie("fontSize", styleID, getExpDate(180, 0, 0));    setSizeStyle(); } </script> </head> <body style="background-color:#ffffff"> <div id="textSizer"> <img src="fontSizer.jpg" height="18" width="72" alt="Font Sizer"><a href="" onclick="changeSizeStyle('smallStyle'); return false"><img class="textSize" src="fontSmall.jpg" height="18" width="18" alt="Smallest" /></a><a href="" onclick="changeSizeStyle(''); return false"><img class="textSize" src="fontMedium.jpg"  height="18" width="18" alt="Default" /></a><a href="" onclick="changeSizeStyle('largeStyle'); return false"><img class="textSize" src="fontLarge.jpg" height="18" width="18" alt="Biggest" /></a> </div> <hr> <p>...текст...</p> </body> </html>

Потом пишем три таблицы стилей: smallFont.css, textSizer.css и largeFont.css соответственно

Так же тебе понадобятся (если не будешь менять код) картинки:
fontLarge.jpg
fontMedium.jpg } размер 18х18
fontSmall.jpg
fontSizer.jpg - надпись "Изменить шрифт"

Первые три картинки обозначают размер шрифта (мал, ср и большой соответственно), вместо них можно использовать контейнер span

Aliance
Ты что, издеваешся

И вообще, не понимаю зачем прописывать в CSS <h1>, <h2>, <h3>... , они и созданы специально для выделения размеров шрифта.

По мне лучше свой класс создать.

Aliance
как то ты всё усложняешь!!! dm9 показал самый удобный вариант!