Чат сообщества
   | |
| Модератор форума: Yuri_G |
| Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Оптимизация дизайна под разные браузеры |
| Оптимизация дизайна под разные браузеры |
|
Зачем нужен "правильный" HTML-код?
HTML - это специальный язык разметки для веб-страниц. Этот язык стандартизован. Значения каждого тега строго определены. Каждый тег имеет определенные атрибуты. HTML-код страницы интерпретируется браузерами и переводится в изображение веб-страницы, которое видит пользователь. Теперь представьте, что HTML код страницы содержит ошибки (не соответствует стандарту). Что в этом случае делать браузеру? Самый простой вариант - это вывести на экран сообщение об ошибке и все. Однако пользователь вряд ли будет рад увидеть вместо страницы, на которой пропущен закрывающийся тег, сообщение об ошибке. Поэтому создатели браузеров пошли другим путем. Браузеры пытаются (в меру своей интеллектуальности) "исправить" некорректный HTML-код. Вот тут и кроется проблема. Каждый браузер имеет свои правила, по которым он будет исправлять HTML ошибки на веб-страницах. Поэтому, если на странице есть ошибки, то существует большая вероятность, что данная страница в разных браузерах будет выглядеть по-разному. Более того, если даже он сейчас выглядит одинаково во всех браузерах, это не значит, что так будет всегда. С выходом новой версии какого-либо браузера коррекция HTML ошибок может быть изменена. А вот следование стандартам изменено вряд ли будет. Если вы хотите, чтобы ваш сайт выглядел одинаково в самых популярных браузерах, постарайтесь избежать ошибок в HTML коде. В общем, бывает когда есть сайт, есть дизайн, но вот проблема - неизвестно, как он выглядит на других браузерах. Те, кто попроще, просто отписываются, что проверил на таком-то браузере, на других - не знаю.
Эта тема для того, чтобы обнаруживать косяки в разных браузерах. Также и проблема оптимизации и предложения по устранении ошибок (только советы, не просите других делать за вас работу) Проблема с отображением тега HR
Советую вместо Code <hr> который красиво может выглядить только в ИЕ использовать цветную однопиксельную картинку: Code <img src="путь до картинки/hr.gif" class="hr"> и прописать ее в стилях: Code .hr {height: 1px; width: 100%; margin-top: 5px; margin-bottom: 5px;} © Andre Разное понимание CSS браузреами типа IE и Opera (там же Mozilla и прочие)
Проблема в следующем: ИЕ и Опера по разному принимают стили и пересчитывают ее на свой лад. Так расстояние между тегами H1 и P разное и поэтому текст по разному смотрится. Для решения этой проблемы надо использовать дополнительную таблицу стилей под IE, поставить там в ручную padding и margin, или другие атрибуты (в зависиости от ситуации) и прописать ссылку в html, заключив ее в специальные теги.
Code <html> <head> <title>Максим Пелевин - Главная страница</title> <link href="http://maxpelevin.3dn.ru/_st/my.css" rel="StyleSheet" type="text/css"> <!--[if IE]><link rel="stylesheet" type="text/css" href="/img/ie7.css" /><![endif]--> <script type="text/javascript" src="/img/global.js"></script> </head> Надеюсь понятно объяснил. © Русак
Решаем проблему с прозрачностью картинок PNG в ИЕ: http://www.tigir.com/alpha_png.htm |
|
http://rock-gallery-r.ucoz.ru/forum/10
сайт по разному отображается в различных браузерах. если в IE всё нормально выглядит, то в опере и Firefox проблемы Скриншот в IE (так и должно быть)  Скриншот в Opera (тут проблемы)  |
|
Raducu,
Quote если в IE всё нормально выглядит, то в опере и Firefox проблемы |
|
Подскажите можно ли исправить баг на моем сайте?
у меня в Google Chrome из-за рекламы сайт разезжается и становится слишком широким,что даже в экран не влезает...и блоки не правильные... Но у некоторых и в Хроме нормально работает... подскажите в чем проблемка и можно ли решить? |
|
|
|
Помогите пожалуйста!
в Google Chrome выглядет сайт нормально, а в IE ужасно. Не знаю что делать  мой сайт www.nailhouse-surgut.ru |
|
defaultNick1147, Вообще то мало чем отличается ...
Прикрепления:
8933864.jpg
(32.5 Kb)
·
1031684.jpg
(33.7 Kb)
|
|
defaultNick1147, два незакрытых тега боди
Quote </head> <body <div id="utbr8214" rel="s50"></div> и внизу Quote <!--/U1BFOOTER1Z--> </div> </div> <body </html> а надо бы прописать везде Quote </body > |
|
webanet, изменила, а результата 0. на моем компе нормально через Google Chrome в IE ужасно, а на других компе все ужасно
|
|
defaultNick1147, я не очень понимаю формулировку ужасно. но могу сказать, что ваши картинки слева растопырили вам меню. а картинка в тексте http://www.nailhouse-surgut.ru/glavnaya_str/Nail.png растопырила вам боди, поэтому везде все выпирает и выезжает
|
|
Я расширяла td.side-block {vertical-align: top; width:257px; padding: 0; border-right: 1px solid #413425;text-align: center;} у меня в Google Chrome первый контейнер на зеленом фоне по левой стороне, а центральная часть полностью занимает бежевый фон. А в IE все съезжает вправо/ Надеюсь понятно объяснила
 Добавлено (25-Авг-2011, 23:47:41) |
|
|
|
Futurial, Напишите Doctype в общих настройках ...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
|
В коде есть участок:
Code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <style type="text/css">.ca1y_6M {position:absolute;right:0px;top:0px;} div > table.ca1y_6M {position:fixed;}</style> <script type="text/javascript">function fa1y_6M(a){try{document.getElementById("pa1y_6M").style.display=a;}catch(e){}try{document.getElementById("a1y_6M").style.display=a;}catch(e){}}function f2a1y_6M(){fa1y_6M('');} new Image().src = "http://counter.yadro.ru/hit;ucoznet2?r"+escape(document.referrer)+((typeof(screen)=="undefined")?"":";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";"+Math.random();</script> <div id="pa1y_6M"><table border="0" cellspacing="0" cellpadding="0" class="ca1y_6M" id="a1y_6M" style="z-index:10000;width:282px"><tr><td valign="top" width="12"><a href="javascript://" onclick="fa1y_6M('none');return false;" title="Закрыть"><img alt="" src="http://s1.ucoz.net/img/ma/cv.gif" style="border:0;width:12px;height:54px;"></a></td><td width="270"><script type="text/javascript">document.write('<iframe ALLOWTRANSPARENCY="true" frameborder="0" width="270" scrolling="no" style="height:430px;background-color:transparent;border:0px" src="/abnl/?begun=2"></iframe>');</script></td></tr></table></div><html xmlns="http://www.w3.org/1999/xhtml"> Хотя в моем коде написано: Code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> Вопрос: откуда берется лишний код и как его убрать? Ссылка на сайт http://xtreme.my1.ru В меню в правом верхнем углу крайние правые кнопки невозможно нажать - накрываются скриптом и, насколько я понял, именно тем, который вставляется системой... ------------------- Чуть позже ------------------ Нашел-таки что это за код)) Это назойливый баннер от юкоза. Невидим потому, что у меня каспер на пару с аутпостом его зарезали - оставили только форму)) Нужно все всегда делать так, чтобы наши мечты реально офигели от наших возможностей! Роман Петрович(с)
http://ai-rus.ru Сообщение отредактировал Skilf - Среда, 07 Сен 2011, 15:29:36
|
|
Здравствуйте, мне требуется срочно ваша помощь!
Установил на сайт свой дизайн сначала тестил и подстраивал его под все браузеры на главной странице все было хорошо, отображалось ровно но после того как установил на все страницы у меня вылезли косяки а именно не ровная видимость в разных браузерах Помогите мне пожалуйста разобраться! вот сайт - gamingo.ru если надо скажите я выложу код страниц сайта |
| |||