Как узнать, откуда взялся стиль для элемента веб-страницы ASP .Net?
У меня затруднительное положение. В моем веб-приложении (C#, .Net 3.0 и т. д.) Есть темы, таблицы CSS и, конечно же, встроенные определения стилей. Вот и много поваров добавляют в суп что-нибудь. Неудивительно, что все это приводит к тому, что на моих страницах иногда появляются причудливые стили.
Я уверен, что все эти стили применяются иерархическим методом (хотя я не уверен в этом порядке). Проблема в том, что каждый стиль применяется как «прозрачный» слой, который просто маскирует то, что он применяет. Я считаю, что это хорошая идея, так как вы можете указать стили для всего, а затем при необходимости использовать их в единственном экземпляре. К сожалению, я не могу сказать, из какого слоя на самом деле появился стиль.
Я мог бы решить эту проблему, явно указав стиль на всех уровнях, но это становится громоздким и сложным в управлении, а страницы работают в 80% случаев. Мне просто нужно выяснить, откуда взялись эти 20%.
Ответы 5
в Firefox используйте инспектор DOM, firebug или проверьте это.
в IE используйте панель инструментов IE dev (или, может быть, лучше, Firebug Lite)
В Google Chrome используйте встроенную функцию проверки элемента.
IMHO, Firebug будет вашим лучшим выбором. Он сообщит вам, из какого файла был создан стиль, и вы можете щелкнуть имя файла, чтобы мгновенно перенести его в соответствующую строку файла.
Примечание. Вы можете нажать ctrl + shift + C на любой странице, чтобы выбрать и проверить элемент с помощью мыши.
Используя Панель инструментов разработчика IE, вы можете выбрать элемент (либо «Выбрать элемент щелчком», либо щелкнув его узел в древовидном представлении DOM) и в панели «Текущий стиль» щелкните правой кнопкой мыши строку и выберите «Стиль трассировки».
Другие инструменты имеют аналогичную функцию.
Вот быстрый снимок экрана с тем, как использовать Firebug, чтобы узнать, откуда элемент получает свой стиль.
Ключ к решению сложной проблемы CSS - выяснить, что вызывает странный вид. Самый простой способ найти - это выборочно комментировать таблицы стилей, пока вы не найдете ту, где комментирование решает проблему. Затем включите таблицу стилей и выборочно закомментируйте правила, пока не найдете то, которое вызывает проблему. Если вам нужно знать, что имеет приоритет перед тем, подробности каскада в CSS подробно описаны. здесь и, в отличие от реализации отдельных правил, это довольно согласованно во всех браузерах.
Однако будет намного лучше, если вы полностью откажетесь от встроенных стилей и будете иметь набор хорошо составленных таблиц стилей, каждая из которых имеет логическую функцию и все правила которой вы понимаете. по той же причине вы не помещаете свой серверный код в случайном порядке в случайные файлы - нас
Поскольку я начинаю с нижнего конца кривой отладки css, я ищу всю возможную помощь. ... комментировать правила проще, чем показано на скринкасте выше ??
Я добавил Firebug Lite, потому что он действительно лучше, чем панель инструментов разработчика IE, IMO