Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
Социальная инженерия и социальные хакеры. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. Программирование. Ступени успешной карьеры. Авторы: Кузнецов М.В., Симдянов И.В. C++. Мастер-класс в задачах и примерах. Авторы: Кузнецов М.В., Симдянов И.В. Объектно-ориентированное программирование на PHP. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Проблемы отображения тени шрифта в разных броузерах
 
 автор: Lusy   (01.08.2008 в 15:12)   письмо автору
 
 

Столкнулась с тем, что тень шрифта прекрасно отображается в Explorer. В Mozilla Firefox - вообще две независимых строки, в Сафари - тень, но некрасивая. В Explorer тоже, если добавить DOCTYPE, две строки. Ниже я приведу код. Но основной вопрос такой: как бороться идеологически? Т.е. грамотно ли будет просто не заморачиваться, а сделать по одной версии сайта на каждый броузер и перенаправлять пользователя? И, похоже, от DOCTYPE нужно отказываться, хотя в списке того, что я должна сделать, заказчик прописал добавление DOCTYPE. Как обосновать этот отказ? Какова существующая практика? Спасибо!
<html>
<head>
<style>
.ttext {
position: relative;
color: #6b6b6b;
text-decoration : none;
font-family: 'Arial Narrow';
font-size: 12px;
letter-spacing: normal;
left : 0 px;
font-weight: bold;

}

.tshadow {
position: relative;
color: white;
text-decoration : none;
font-family: 'Arial Narrow';
font-size: 12px;
letter-spacing: normal;
left : 0 px;
font-weight: bold;
top: 17 px;
left : 1 px;
}
.ttext1 {position: relative; font-size: 11 px; left : 0 px; font-weight:bold;
font-family : Arial Narrow; color : "#6b6b6b"}
.tshadow1 {position: relative; top: 15 px; left : 1 px; font-size: 11 px;
font-weight:bold; font-family : Arial Narrow; color: white;}
</style>
</head>
<body bgcolor="#CCCCCC" text="#333333" link="#C66300" vlink="#0D0600" alink="#EC7600" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('GUI/topmenu191_over.gif','GUI/topmenu90.gif','GUI/topmenu85.gif', 'GUI/selectedtrans_over.gif', 'GUI/moreinform_over.gif')">
<table>
<tbody>
<tr>
<td valign="center">
<div class="tshadow">NEWPOINT CAPITAL PARTNERS INC., TESTIMONIALS, SELECTED TRANSACTIONS, MORE INFORMATION
</div>
<div class="ttext">NEWPOINT CAPITAL PARTNERS INC., TESTIMONIALS, SELECTED TRANSACTIONS, MORE INFORMATION
</div>

</td>
</tr>
<tr>
<td valign="center">
<div class="tshadow1">NEWPOINT HOME, WHY NEWPOINT, WHAT WE DO, OUR TEAM, SITE MAP
</div>
<div class="ttext1">NEWPOINT HOME, WHY NEWPOINT, WHAT WE DO, OUR TEAM, SITE MAP
</div>

</td>
</tr>
</tbody>
</table>
</body>
</html>

  Ответить  
 
 автор: AlexSol   (01.08.2008 в 15:15)   письмо автору
 
   для: Lusy   (01.08.2008 в 15:12)
 

абсолютное позиционирование

  Ответить  
 
 автор: Lusy   (02.08.2008 в 08:03)   письмо автору
 
   для: AlexSol   (01.08.2008 в 15:15)
 

Спасибо. А можно не в двух словах? Взялась за дело, сейчас понимаю, что мало знаю и умею. Отказаться уже нельзя. Но закончить надо. Спасибо за помощь.

  Ответить  
 
 автор: ExtraBrain   (02.08.2008 в 12:14)   письмо автору
 
   для: Lusy   (01.08.2008 в 15:12)
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>

<style>
.ttext 
{
  color           : #6b6b6b; 
  text-decoration : none; 
  font-family     : 'Arial';
  font-size       : 12px;
  letter-spacing  : normal; 
  font-weight     : bold;
}

.tshadow 
{
  color           : white; 
  text-decoration : none; 
  font-family     : 'Arial';
  font-size       : 12px;
  letter-spacing  : normal; 
  font-weight     : bold;
}

.ttext1 {position: relative; font-size: 11 px; left : 0 px; font-weight:bold;
font-family : Arial Narrow; color : "#6b6b6b"}

.tshadow1 {position: relative; top: 15 px; left : 1 px; font-size: 11 px;
font-weight:bold; font-family : Arial Narrow; color: white;}

</style>
</head>

<body bgcolor="#CCCCCC" text="#333333" link="#C66300" vlink="#0D0600" alink="#EC7600" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('GUI/topmenu191_over.gif','GUI/topmenu90.gif','GUI/topmenu85.gif', 'GUI/selectedtrans_over.gif', 'GUI/moreinform_over.gif')">

<table align="center">
<tbody>
<tr>
<td style="font-size:12px">
<span class="tshadow" style="position:relative;left:0px;top:9px;">NEWPOINT CAPITAL PARTNERS INC., TESTIMONIALS, SELECTED TRANSACTIONS, MORE INFORMATION</span>
<br>
<span class="ttext" style="position:relative;left:-1px;top:-7px;">NEWPOINT CAPITAL PARTNERS INC., TESTIMONIALS, SELECTED TRANSACTIONS, MORE INFORMATION</span>

</td>
</tr>
<tr>
<td valign="center">
<div class="tshadow1">NEWPOINT HOME, WHY NEWPOINT, WHAT WE DO, OUR TEAM, SITE MAP 
</div>
<div class="ttext1">NEWPOINT HOME, WHY NEWPOINT, WHAT WE DO, OUR TEAM, SITE MAP 
</div>

</td>
</tr>
</tbody>
</table>

</body>
</html>

Верхняя надпись переделана под все броузеры, а нижняя оставлена без изменений.

P.S. Люся, а из какого ты города, если не секрет? :-)

  Ответить  
 
 автор: Lusy   (02.08.2008 в 15:55)   письмо автору
 
   для: ExtraBrain   (02.08.2008 в 12:14)
 

Спасибо огромное!

  Ответить  
 
 автор: ExtraBrain   (02.08.2008 в 23:23)   письмо автору
 
   для: Lusy   (02.08.2008 в 15:55)
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
  <meta http-equiv="Content-Language" content="ru"> 
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>

<script>

function Shadow(s,j,c1,c2) {
 document.write('<div style="position:relative; left:0px;top:0px;">');
 document.write('<div style="font: normal 40px Arial;color:'+c1+'; position:absolute; left:0px;top:0px;"><p style="margin-top:0px;" align="'+j+'">'+s+'</p></div>');
 document.write('<div style="font: normal 40px Arial;color:'+c2+'; position:absolute; left:-1px;top:-1px;"><p style="margin-top:0px;" align="'+j+'">'+s+'</p></div>');
 document.write('<div>');
}

</script>
<body>

<table width="100%">
<col width="33%"><col width="34%"><col width="33%">
<tr height="200" valign="top">
<td>11111</td>
<td><script> Shadow("А здесь надо размещать все, что хочется увидеть на странице.","center","#000","#f00"); </script></td>
<td>33333</td>
</tr></table>

</body>
</html>


Вот ещё и функция для этого дела.

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования