Создание веб-страниц: обзор 10 распространенных ошибок DIV+CSS
Автор：Eve Cole
Время обновления：2009-06-12 17:53:00
1. Проверьте, нет ли в HTML-элементах орфографических ошибок и не забыт ли закрывающий тег.
Даже опытные пользователи часто неправильно понимают вложенность элементов div. Для проверки ошибок можно использовать функцию проверки Dreamweaver.
2. Проверьте правильность CSS
Проверьте орфографические ошибки, забыли } в конце и т. д. Вы можете использовать CleanCSS для проверки CSS на наличие орфографических ошибок. CleanCSS — это инструмент для уменьшения веса CSS, но он также может проверять орфографические ошибки.
3. Определите, где произошла ошибка
Если ошибка влияет на общий макет, вы можете удалять блоки div один за другим, пока отображение не вернется в нормальное состояние после удаления определенного блока div, и вы не сможете определить, где произошла ошибка.
4. Используйте атрибут border, чтобы определить характеристики макета элемента ошибки.
Использование макета атрибута с плавающей запятой может привести к ошибкам, если вы не будете осторожны. На этом этапе добавьте к элементу атрибут границы, чтобы определить границу элемента, и причина ошибки будет выявлена.
5. Родительский элемент элемента с плавающей запятой не может указывать атрибут очистки.
В MacIE, если вы используете атрибут Clear в родительском элементе элемента с плавающей запятой, расположение окружающих элементов с плавающей запятой будет хаотичным. Это известная ошибка MacIE. Если вы этого не знаете, вы пойдете в обход.
6. Элемент float должен указывать атрибут ширины.
Многие браузеры имеют ошибки при отображении элементов с плавающей запятой неопределенной ширины. Поэтому независимо от содержимого элемента float для него должен быть указан атрибут ширины.
Кроме того, попробуйте использовать em вместо px в качестве единицы измерения при указании элементов.
7. Элементы с плавающей запятой не могут указывать такие атрибуты, как поля и отступы.
В IE есть ошибка при отображении элементов с плавающей запятой с указанными полями и отступами. Поэтому не указывайте атрибуты поля и заполнения для элементов с плавающей запятой (вы можете вложить элемент div внутрь элемента с плавающей запятой, чтобы установить поля и отступы). Вы также можете использовать хаки для указания необычных значений для IE.
8. Сумма ширин float-элементов должна быть меньше 100%.
Если сумма ширин элементов с плавающей запятой равна ровно 100%, некоторые древние браузеры не будут отображать ее правильно. Поэтому убедитесь, что сумма ширин меньше 99%.
9. Сбросили ли вы стиль по умолчанию?
Некоторые атрибуты, такие как поля, отступы и т. д., будут интерпретироваться по-разному разными браузерами. Поэтому перед разработкой лучше всего установить все поля и отступы на 0, стиль списка на нулевой и т. д.
10. Вы забыли написать DTD?
Если результаты отображения в разных браузерах по-прежнему различаются, как бы вы их ни настраивали, вы можете проверить, не забыли ли вы написать следующую строку DTD в начале страницы:
＜!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " http://www.w3.org/TR/html4/loose.dtd "＞
