Ответ 1
Возможно, вы захотите инкапсулировать свой css в более формальную структуру CSS. Вы можете создать свою собственную платформу, но есть некоторые полезные фреймворки css с открытым исходным кодом, такие как yahoo YUI и Blue Print CSS http://www.blueprintcss.org/
Самое приятное в этом подходе заключается в том, что он прилагает большие усилия для устранения проблем с браузером вокруг шрифтов и макета.
В зависимости от того, как далеко вы продвигаетесь, вам, возможно, придется существенно коснуться существующей разметки. В зависимости от того, насколько велико ваш сайт, я бы попытался поэтапно настроить стили и перенести их на формальную структуру CSS. В долгосрочной перспективе это сделает CSS более управляемым и понятным другим разработчикам, знакомым с концепцией структуры.
Постепенно попытайтесь устранить избыточные и неучтенные стили.
Я бы также создал файл debug.css. Возьмите все старые имена стилей и добавьте к ним стиль идентификации. Например:
.myoldstyle {border: solid 1px red};
Затем вы можете определить, где используется старый стиль на сайте. Каждый стиль должен учитываться и переноситься в новую систему. Когда определенный стиль старой системы был правильно перенесен в новую систему, вы можете удалить (или лучше прокомментировать) стиль идентификации из файла debug.css. Вы можете быть уверены, что мигрировали все стили, когда debug.css не показывает никаких побочных эффектов на выходе.
Это может быть трудоемкий процесс, но систематическое его приближение может быть полезным.
Кроме того, вы можете начать просматривать свой сайт без каких-либо css. Просто ознакомьтесь с логической и семантической разметкой кода. Наличие чистой базы HTML-кода помогает при отладке стилей стиля.
Что касается организации CSS, я хотел бы разделить на основные категории: макет, типография, lookandfeel, navigation
Сохраняйте всю информацию о цвете в таблице стилей lookandfeel. Именно здесь вы будете тратить больше времени, пытаясь удовлетворить клиентские визуальные вкусы и желания. Удобно хранить это отдельную логическую таблицу стилей. Другой материал более функциональный и стандартизированный. Наличие этой абстракции значительно упрощает выделение визуальных эффектов стилей.
И один последний совет, посмотрите плагин Firebug Firefox или debabugger Safari. Они могут отображать вычисленные стили (способ стилей и элементов в конечном итоге определяется как применяются различные стили), и вы можете настраивать конкретные стили в реальном времени на ходу, чтобы вы могли исследовать эффекты определенного изменения стиля в сложном CSS система.
И самое главное, сохраните отдельный файл ie.css. Это должна быть последняя таблица стилей, на которую ссылаются ваши заголовки. Если вам нужно обойти обходные пути для IE, поставьте их здесь. И только выставляйте эту таблицу стилей в IE через условные комментарии.
http://www.quirksmode.org/css/condcom.html
Это самый быстрый способ решить проблемы IE 6.