Как просмотреть окончательный расчетный CSS, включая переопределения, такие как настройки высокой контрастности?

Есть ли такой инструмент? Например, я хочу увидеть все стили, примененные к тегу BODY. Я знаю, что это не делает его читабельным. В моем случае есть несколько опций, которые могут динамически изменять CSS либо через браузер, либо через исходный код (JSP), либо из-за системных настроек, таких как высококонтрастный режим и т. Д. Я хочу, чтобы окончательные стили использовались для визуализации страницы, которая показывается. Пожалуйста, предложите

РЕДАКТИРОВАТЬ: Если бы я получил инструмент, который поддерживает IE6, это было бы здорово. Потому что моя страница будет просматриваться там чаще, чем любые другие браузеры.

Спасибо и С уважением Прасанна Рам

4 ответа

Решение

Установленные ОС высококонтрастные настройки не имеют ничего общего с CSS. (Или с браузерами в этом отношении; браузер будет совершенно не осведомлен о таких настройках и НЕ изменит никакого CSS для высококонтрастных общесистемных настроек.) Я не думаю, что вы найдете какой-либо инструмент, который "настраивает" CSS на компенсировать высококонтрастные настройки.

(Может быть, есть онлайн-инструменты, точно так же, как Vischeck может показать вам, как выглядят люди, страдающие дальтонизмом. Но если подобный инструмент существует, я на самом деле не уверен, как это поможет любому разработчику, которому не нужны высококонтрастные настройки, при определении, может ли кто-то еще просматривать веб-сайт... Таким образом, такой онлайн-инструмент затем должен будет "преобразовать" высококонтрастные изображения для людей с нормальным зрением, чтобы получить представление о том, что может испытать человек с нарушениями зрения.)

Вы пробовали использовать Firebug?

Firebug интегрируется с Firefox, чтобы во время просмотра у вас было множество инструментов веб-разработки. Вы можете редактировать, отлаживать и отслеживать CSS, HTML и JavaScript в режиме реального времени на любой веб-странице.

Попробуйте использовать Chrome - вы можете выбрать любую часть страницы, щелкнуть правой кнопкой мыши и "Проверить элемент".

Это показывает дерево всего кода страницы, и вы можете увидеть CSS, примененный к любому элементу в дереве

Использование Virtual PC [*] (или "Режим Windows XP" в Windows 7) (или другого решения для виртуальной машины) является хорошим способом тестирования веб-страниц в самых разных браузерах и настройках. Идея заключается в том, что поскольку вы не можете установить IE6/7/8 одновременно на одном ПК, вы можете установить их на разные виртуальные машины для тестирования.

Microsoft предоставляет образы VPC, предварительно сконфигурированные с IE6/7/8 на XP или Vista. Они предназначены для больших загрузок (около 700 МБ), но предоставляют полный образ VPC, предварительно настроенный на одну конкретную версию IE, предназначенную для тестирования совместимости приложений и веб-сайтов. Они ограничены по времени и истекают через 120 дней после первого использования (для образов Vista) или 1 апреля 2010 г. (для образов XP (если предположить, что это не просто первоапрельская шутка)).

Преимущество для вас: настройте один VPC для работы в режиме высокой контрастности и запускайте его параллельно с другим VPC, работающим в режиме без высокой контрастности (с той же версией IE).

[*] Не одобрение продукта Virtual PC. Вы можете сделать то же самое с VMware, VirtualBox или выбранным вами продуктом виртуальной машины.

Другие вопросы по тегам