Ako prispôsobiť vzhľad tlačidla Orange Firefox

Ako prispôsobiť vzhľad tlačidla Orange Firefox
Ako prispôsobiť vzhľad tlačidla Orange Firefox

Video: Ako prispôsobiť vzhľad tlačidla Orange Firefox

Video: Ako prispôsobiť vzhľad tlačidla Orange Firefox
Video: Interlaced vs. Progressive Scan - 1080i vs. 1080p - YouTube 2024, Apríl
Anonim
Máte unavený pohľad na oranžové tlačidlo ponuky Firefoxu? Rozhranie prehliadača Firefox je úplne prispôsobiteľné, takže môžete zmeniť farbu, text a ďalšie vlastnosti tlačidla ponuky Firefox a vytvoriť si vlastný vzhľad.
Máte unavený pohľad na oranžové tlačidlo ponuky Firefoxu? Rozhranie prehliadača Firefox je úplne prispôsobiteľné, takže môžete zmeniť farbu, text a ďalšie vlastnosti tlačidla ponuky Firefox a vytvoriť si vlastný vzhľad.

Ak chcete zmeniť vzhľad tlačidla ponuky Firefox, upravíme súbor userChrome.css. Tento súbor umožňuje zmeniť vzhľad akejkoľvek časti Firefoxu, rovnako ako jeho funkčnosť.

Pred ponorom do úpravy súboru userChrome.css nainštalujeme doplnok nazývaný ChromEdit Plus, ktorý nám umožní jednoducho upraviť súbor a uložiť ho v správnom formáte. Kliknutím na nasledujúci odkaz prejdete na webovú stránku ChromEdit Plus.
Pred ponorom do úpravy súboru userChrome.css nainštalujeme doplnok nazývaný ChromEdit Plus, ktorý nám umožní jednoducho upraviť súbor a uložiť ho v správnom formáte. Kliknutím na nasledujúci odkaz prejdete na webovú stránku ChromEdit Plus.

https://webdesigns.ms11.net/chromeditp.html

Kliknite na tlačidlo Pridať na Firefox na stránke.

Môže sa zobraziť nasledujúca správa. Kliknutím na tlačidlo Povoliť pokračujte v inštalácii doplnku ChromEdit Plus.
Môže sa zobraziť nasledujúca správa. Kliknutím na tlačidlo Povoliť pokračujte v inštalácii doplnku ChromEdit Plus.

POZNÁMKA: Buďte veľmi opatrní, čo umožňujete pri inštalácii rozšírení a iného softvéru. Ak si nie ste istí výrobkom alebo nedôverujete spoločnosti, neinštalujte ho. Testovali sme ChromEdit Plus a zistili sme, že je bezpečný a spoľahlivý.

Zobrazí sa dialógové okno Inštalácia softvéru. Kliknite na tlačidlo Inštalovať teraz, ktoré nemusia byť k dispozícii, kým sa nezastaví odpočítavanie.
Zobrazí sa dialógové okno Inštalácia softvéru. Kliknite na tlačidlo Inštalovať teraz, ktoré nemusia byť k dispozícii, kým sa nezastaví odpočítavanie.

POZNÁMKA: Môžete zmeniť dĺžku odpočítavania na tlačidlo Inštalovať, ale nedoporučujeme ho vypnúť.

Ak chcete dokončiť inštaláciu, musíte reštartovať Firefox. Kliknite na položku Reštartovať teraz v rozbaľovacom dialógovom okne.
Ak chcete dokončiť inštaláciu, musíte reštartovať Firefox. Kliknite na položku Reštartovať teraz v rozbaľovacom dialógovom okne.
Po reštarte aplikácie Firefox sa v pravom rohu okna Adresa pridá tlačidlo ChromEdit Plus. Kliknutím naň otvoríte okno ChromEdit Plus.
Po reštarte aplikácie Firefox sa v pravom rohu okna Adresa pridá tlačidlo ChromEdit Plus. Kliknutím naň otvoríte okno ChromEdit Plus.
K dispozícii sú tri karty v predvolenom nastavení v okne ChromEdit Plus. Budeme upravovať súbor userChrome.css, ktorý je na prvej karte. Ak je karta prázdna, skopírujte a vložte nasledujúci text na kartu userChrome.css a kliknite na tlačidlo Uložiť. Toto vám poskytuje predvolený súbor userChrome.css.
K dispozícii sú tri karty v predvolenom nastavení v okne ChromEdit Plus. Budeme upravovať súbor userChrome.css, ktorý je na prvej karte. Ak je karta prázdna, skopírujte a vložte nasledujúci text na kartu userChrome.css a kliknite na tlačidlo Uložiť. Toto vám poskytuje predvolený súbor userChrome.css.

@namespace url(“https://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul”); #appmenu-button { background: #orange !important; } #appmenu-button dropmarker:before { content: “Firefox” !important; color: #FFFFFF !important; } #appmenu-button.button-text { display: none !important; }

Možno už máte súbor userChrome.css, v takom prípade už na karte userChrome.css už bude text. Skopírujte celý vyššie uvedený text s výnimkou prvého riadku, riadku @namespace a vložte ho na kartu niekde za riadok @namespace. Ak chcete zachovať to, čo už máte, môžete text prilepiť na konci súboru.

DÔLEŽITÉ: Uistite sa, že všetky úvodzovky v userChrome.css NIE JE šikovné úvodzovky, vrátane tých, ktoré sú uvedené v riadku @namespace. Mali by to byť bežné, rovno citáty. Ak je niektorá z nich inteligentné, súbor nebude mať vplyv na vzhľad Firefoxu.

Kliknutím na položku Reštartovať môžete reštartovať Firefox pomocou nového alebo revidovaného súboru userChrome.css.

V tomto príklade zmeníme farbu pozadia na tmavú modrú a zmeníme text "Firefox" na "How-To Geek".
V tomto príklade zmeníme farbu pozadia na tmavú modrú a zmeníme text "Firefox" na "How-To Geek".

Ak chcete zmeniť farbu pozadia, zmeňte text "#orange" na riadku "pozadie" v sekcii "# appmenu-button" na inú farbu pomocou hexadecimálneho farebného kódu alebo kódu farby HTML. Napríklad sme si vybrali tmavo modrú s hexadecimálnym farebným kódom # 2C4362.

POZNÁMKA: Ak chcete zistiť kód šesťfarebnej farby pre požadovanú farbu, pozrite si naše články o získavaní hexadecimálnych kódov farieb z desatinných farieb RGB, výber farieb z ľubovoľného miesta na obrazovke a získanie farebných kódov vo viacerých formátoch.

Ak chcete zmeniť text na tlačidle, zmeňte text "Firefox" na riadok "obsah" v sekcii "# appmenu-button dropmarker: before" na požadovaný text, napríklad "How-To Geek". Za text sme pridali medzeru, aby sme mali väčší priestor medzi textom a šípkou rozbaľovacej ponuky na tlačidle.

Môžete tiež zmeniť farbu textu tak, že zmeníte riadok "farba" v rovnakom "# appmenu-button dropmarker: before". Farbu textu sme ponechali ako bielu (#FFFFFF), ale môžete ju zmeniť na niečo ako svetlošedú (# F2F2F2) alebo niečo podobné.

Kliknutím na položku Uložiť a potom na položku Reštartovať vykonajte zmeny.

Tlačidlo je teraz tmavo modré a hovorí "How-To Geek".
Tlačidlo je teraz tmavo modré a hovorí "How-To Geek".
Môžete tiež pridať obrázok na pozadí, okrem zmeny farby pozadia. Vytvorili sme obrázok, ktorý má na ľavej strane funkciu How-To Geek favicon a priehľadné pozadie, ktoré zobrazuje tmavomodrá farba pozadia. Ak chcete do svojho tlačidla pridať obrázok pozadia, pridajte nasledujúci riadok do sekcie "# appmenu-button" a zmeňte cestu v úvodzovkách na umiestnenie obrázka v počítači. Ponechajte "file: ///" v ceste.
Môžete tiež pridať obrázok na pozadí, okrem zmeny farby pozadia. Vytvorili sme obrázok, ktorý má na ľavej strane funkciu How-To Geek favicon a priehľadné pozadie, ktoré zobrazuje tmavomodrá farba pozadia. Ak chcete do svojho tlačidla pridať obrázok pozadia, pridajte nasledujúci riadok do sekcie "# appmenu-button" a zmeňte cestu v úvodzovkách na umiestnenie obrázka v počítači. Ponechajte "file: ///" v ceste.

background-image: url(“file:///C:/Users/Lori/Pictures/htg_background.png”) !important;

Kliknite na tlačidlo Uložiť a znova spustiť znovu.

Odporúča: