Использование платформы XHTML+CSS дает много преимуществ, но действительно есть некоторые проблемы. Будь то из-за неопытности или неясного мышления, я сначала опишу некоторые проблемы, с которыми столкнулся, чтобы избавить всех от поисков.
1. Интерпретация модели BOX в Mozilla Firefox и IE несовместима, что приводит к разнице в 2 пикселя. Решение:
div{margin:30px!important;margin:28px;}
Обратите внимание, что порядок этих двух полей не должен быть записан в обратном порядке. по словам Аджи! Этот важный атрибут не распознается IE, но другие браузеры могут. Таким образом, в IE это на самом деле интерпретируется следующим образом:
Еслиdiv{maring:30px;margin:28px}
определяется повторно, будет выполнен последний из них, поэтому вы не можете просто написатьmargin:XXpx!important
2. Интерпретация BOX для IE. IE5 и IE6 несовместимы в IE5. div{width:300px;margin:0 10px 0 10px;}Ширина div будет интерпретироваться как 300px-10px (правое отступы)-10px (левое отступы). div составляет 280 пикселей, а ширина в IE6 и других браузерах рассчитывается как 300 пикселей + 10 пикселей (правое отступ) + 10 пикселей (левое отступ) = 320 пикселей. На данный момент мы можем внести следующие изменения:
div{width:300px!important;width /**/:340px;margin:0 10px 0 10px}
Я не совсем понимаю, что это за /**/, я только знаю. IE5 и Firefox Оба поддерживаются, но IE6 не поддерживает. Если кто-нибудь это понимает, пожалуйста, дайте мне знать. Спасибо! :)
3. Тег ul по умолчанию имеет значение заполнения в Mozilla, но в IE значение имеет только поле, поэтому его определение сначала:
ul{margin:0;padding:0;}
может решить большинство проблем.
4. Что касается скриптов, атрибут языка не поддерживается в xhtml1.1. Вам нужно только изменить код на:
Вот и все.
5. Если вы установите направления float и text-align в контейнере BOX одинаковыми:
{float:left;text-align:left;margin:0 0 0 200px;}
мы можем внести следующие изменения:
{float :left; text-align:left;margin:0 0 0 200px;display:inline;}