Настройка фона в Firefox Отзывчивый дизайн View

Question

Есть ли способ настроить фон экрана в Firefox «Отзывчивый дизайн»? Я хотел бы вставить изображение (например, пустой шаблон iphone) и использовать программное обеспечение для записи экрана для имитации мобильной демонстрации. Насколько я могу судить, нет возможности изменить фон, используя css или другие аддоны.

Я смотрел симулятор Firefox OS, но он не охватывает мои потребности (и вы не можете использовать аддоны, такие как firebug или Agent Spoofer).

Answer 1

Не зная, что вы пробовали, мы должны угадать, что вам нужно, чтобы ответить на этот вопрос. Вам просто нужно знать, что такое селекторы? Вам нужно знать, как применять CSS? Вы пытаетесь сделать надстройку, которая вносит такие изменения?

Без дополнительной информации, здесь есть некоторые общие сведения о CSS используется для стиля этого:

Адаптивный режим стилизованного с помощью CSS в chrome://browser/content/browser.css и chrome://browser/skin/browser.css. Оба они расположены в пределах omni.ja (архив zip с расширением имени файла изменен на .ja) файл в браузер. Внутри этого архива указанные файлы: chrome/browser/content/browser/browser.css, chrome/browser/skin/classic/browser/browser.css и chrome/browser/skin/classic/aero/browser /browser.css.

Фон выглядит <vbox> и имеет class="browserContainer" с атрибутом: responsivemode="true".

По Firefox 36.0.4 соответствующий CSS является (от chrome://browser/skin/browser.css):

.browserContainer[responsivemode] { 
    background-color: #222; 
    padding: 0 20px 20px 20px; 
} 

Есть несколько способов, которые вы могли бы идти о внесении изменений в это. Один из способов будут извлечь содержимое omni.ja файла, внести изменения в соответствующем browser.css файл затем поместить все файлы обратно в архив с именем omni.ja и поставить этот архив в браузер вместо исходного файла. Другим методом было бы создать надстройку, которая переопределяет файл chrome: //browser/skin/browser.css (это можно сделать с помощью команды override в файле chrome.manifest надстройки. Еще один метод для надстройку непосредственно применить новый стиль в одном из нескольких различных способов.

Однако, вероятно, проще всего создать [профиль directtory] /chrome/userChrome.css файл с CSS вы желаете использовать (вам, вероятно, придется создать каталог chrome в вашем каталоге профиля). Например, следующее приведет к красному фону для отзыва адаптивного дизайна:

/* 
* Edit this file and copy it as userChrome.css into your 
* profile-directory/chrome/ 
*/ 
/* 
* This file can be used to customize the look of Mozilla's user interface 
* You should consider using !important on rules which you want to 
* override default settings. 
*/ 
/* 
* Do not remove the @namespace line -- it's required for correct functioning 
*/ 
/* Set default namespace to XUL */ 
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 


.browserContainer[responsivemode], 
vbox[anonid=browserContainer][responsivemode]{ 
    background-color:red !important; 
}