Полная спецификация userChrome.css в Firefox
Уже было множество вопросов о файле userChrome.css в Firefox. Большинство из них проистекает из того факта, что, по-видимому, нет полной спецификации для этого файла от Mozilla, полный список тегов CSS, которые влияют на браузер и каковы эти эффекты. Вместо этого люди полагаются на метод проб и ошибок, а также некоторые приемы, которые работают с одной версией, быстро устаревают с новой версией.
Мне было интересно, действительно ли такая спецификация недоступна и имеет ли смысл в Mozilla не выпускать ее (если такой спецификации нет) и не поддерживать ее в актуальном состоянии.
Как можно найти полный список тегов CSS, которые можно настроить с помощью userChrome.css?
1 ответ
Гарантий нет, поэтому все, что вы измените, может быть нарушено следующей версией. Преимущество заключается в том, что вы получаете гораздо больше гранулярности и гибкости, чем если бы они указали только несколько ограниченных API.
Однако есть два способа выяснить, какие элементы могут быть рестайлинг в текущей версии.
Во-первых, что вы обычно пытаетесь изменить userChrome.css известен как браузер Chrome, части браузера за пределами содержимого веб-страницы. Это включает в себя панель вкладок, адресную строку и т. Д. Что вы хотите сделать, это открыть это в инспекторе DOM, чтобы вы могли выяснить, какой селектор CSS будет нацеливаться на элемент, который вы хотите изменить.
Самый простой способ открыть инспектор на странице - перейти к chrome://browser/content/browser.xul, который откроет браузер Chrome внутри области содержимого вкладки и даст вам забавное двойное окно:
Отсюда вы хотите открыть инструмент инспектора страниц. Есть несколько способов открыть его, но мне лично нравится сочетание клавиш F12. Затем вы можете использовать его для выбора элемента и просмотра существующих правил CSS.
Вы можете щелкнуть правой кнопкой мыши элемент в дереве и использовать контекстное меню, чтобы "Копировать -> Селектор CSS", чтобы получить быстрый и простой селектор для использования в вашем userChrome.css, но лучше, если у вас есть некоторое представление об основах селекторов CSS, чтобы вы могли найти лучший.
Помните, что инспектор страниц проверяет содержимое страницы, а не браузер Chrome. Это работает только в этом случае, потому что мы запустили копию хрома внутри страницы, как контент.
Другой способ проверить браузер Chrome - использовать панель инструментов браузера, которая позволит вам просматривать обычные живые окна. Он менее хакерский, чем открытие Chrome в качестве контента, но он также немного сложнее для начала и не дает большой выгоды для простого рестайлинга.