Евгений Годов godov@conternet.ru http://nickelback.by.ru/ |
Октябрь 03, 2003 [02:19] |
Иногда бывает так, что при смене разрешения, общая структура остается нормальной, но текст становится плохочитаемым. Чтобы этого избежать, предлагаю простой скрипт:
<SCRIPT language=JavaScript>
<!--
if
(screen.width == 640) {document.write ("<LINK
href=´1.css´ type=text/css
rel=stylesheet>")};
if
(screen.width == 800) {document.write ("<LINK
href=´2.css´ type=text/css
rel=stylesheet>")};
if
(screen.width == 1024) {document.write ("<LINK
href=´3.css´ type=text/css
rel=stylesheet>")};
//-->
</SCRIPT>
Работает
он так: как только загружается страница, браузер
определяет разрешение монитора пользователя и
в зависимости
от этого выбирает
нужную таблицу каскадных стилей.
В данном примере файл 1.css оптимизиоран под разрешение
640Х480
пикслей,
2.css - 800Х600
3.css- 1024Х768
Вам лишь необходимо создать и подогнать эти три файла
под соотвествующие разрешения.
Внимание! Когда будете подготянять
и баловаться с разными
разрешениями, не забываейте нажимать F5 для обновления
страницы.
Пример:
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type"
CONTENT="text/html;
charset=windows-1251">
<SCRIPT language=JavaScript> // в данном случае
под два разрешения
<!--
if (screen.width
== 800) {document.write ("<LINK
href=´1.css´ type=text/css
rel=stylesheet>")};
if
(screen.width == 1024) {document.write ("<LINK
href=´2.css´ type=text/css
rel=stylesheet>")};
//--></SCRIPT>
</HEAD>
<BODY>
<div id=text1>Работа со
стилями</div>
<div
id=text2>Работа со стилями</div>
</BODY>
</HTML>
Содержания файлов с таблицами
стилей:
1css:
BODY
{BACKGROUND: #000000; }
#text1
{ font-family: Verdana; font-size: 18pt; color:yellow;
font-weight : bold;}
#text2 {font-family: ms san serif, font-size: 9pt;
color:
#FC1301; font-weight :
bold;}
2css:
BODY {BACKGROUND: #000000; }
#text1 { font-family: Verdana; font-size: 15pt;
color:
red; font-weight :
bold;}
#text2 {font-family: ms
san serif, font-size: 7pt; color:
blue; font-weight : bold;}
Если вы хорошо разбираетесь в CSS, то подгонять сможете не только текст, но и все что угодно!!!
Полное описания языка CSS:
http://vsplanet.iphosting.ru/
Задумывайтесь о других! Пусть Ваша работа будет красивой не только на Вашем мониторе (:-)