методы / инструменты для прохождения через css, чтобы найти, какой стиль перезаписывается по какому правилу? - PullRequest
Новая
       1

методы / инструменты для прохождения через css, чтобы найти, какой стиль перезаписывается по какому правилу?

1 голос
/ 27 марта 2012

На этой странице:

http://www.palosverdes.com/sandbox/9slategrey/index.cfm

Я пытаюсь добавить новое меню (меню вверху под заголовком «Город Ранчо Палос Вердес»). Похоже, что это меню имеет много общих имен контейнеров с другими элементами на странице. До сих пор другие элементы сосуществовали в гармонии, но они разрушают это меню.

Проблема усугубляется тем, что с меню что-то не так, в зависимости от того, в каком браузере вы его просматриваете.

Какой метод / инструменты я должен использовать, чтобы выбрать, откуда и откуда идут стили, и как лучше всего разрешить любые конфликты стилей? И почему проблемы с меню могут быть разными в разных браузерах?

Ответы [ 4 ]

2 голосов
/ 27 марта 2012

Элемент проверки Google Chrome (щелкните правой кнопкой мыши -> Проверить элемент) покажет соответствующие правила CSS и вычисленный стиль для каждого элемента.Я нахожу это очень полезным для выяснения, какое правило вызывает какой эффект.

1 голос
/ 27 марта 2012

Оказывается, глядя на стили в firebug, я не следил за ошибкой консоли.Когда я посмотрел на верхнюю часть экрана, я заметил, что количество ошибок увеличивается с каждым разом, когда я зависал над пунктом меню.

Произошла ошибка, такая как end.fx не определена, и это произошло в файле javascript, потому что я определил начальный цвет анимации как «прозрачный», который, пока файл js понимал, выкинулошибка при попытке вычислить анимацию от "прозрачного" до конечного значения rgb.

1 голос
/ 27 марта 2012

Какой метод / инструмент я должен использовать, чтобы выбрать, какие стили

Для Firefox есть плагин Firebug. Для Chrome и IE нажмите F12 или CTRL + SHIFT + I для встроенного отладчика. Для Opera есть встроенная стрекоза (я забыл горячую клавишу). Safari .. Я не знаю. @prodigitalson говорит, что он такой же, как Chrome.

какие стили происходят откуда

в отладчике должна быть разбита стили, применяемые к элементам, а также вычисленные (объединенные) стили и те стили, которые отменены.

как лучше всего разрешать конфликты стилей?

в CSS есть то, что мы называем " специфичность ". Хотя вы можете думать, что определения стилей каскадно (перекрывают) другие стили сверху вниз, подумайте еще раз. попытайтесь определить, какие стили управляют другими, и очистить их.

А почему проблемы с меню могут быть разными в разных браузерах?

ошибка .. несоответствия браузера? IE имеет довольно странную коробочную модель (особенно в старых версиях). попробуйте добавить doctype, например <!DOCTYPE html>, в самом первом коде, чтобы обеспечить строгий режим. Это не избавит вас от проблемы с моделью коробки IE, но, по крайней мере, вы спасете себя от " Quirks Mode "

1 голос
/ 27 марта 2012

Я предлагаю вам начать с использования «простых» инструментов, таких как Firebug и Developer Tools, чтобы увидеть, где каждый элемент получает свои стили.

Щелкните правой кнопкой мыши элемент, для которого вы хотите просмотреть стили, выберите «Инспектировать с помощью Firebug».и посмотрите на правой панели на вкладке "Стили", чтобы увидеть примененные и переопределенные стили элемента и из какой они строки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...