Cara Menyesuaikan Rupa Menu Button Orange Firefox

Adakah anda bosan melihat butang menu Firefox berwarna jingga? Antara muka Firefox sepenuhnya disesuaikan, jadi anda boleh menukar warna, teks, dan sifat-sifat lain dari menu menu Firefox untuk membuat tampilan tersuai anda sendiri.

Untuk menukar penampilan butang menu Firefox, kami akan mengedit fail penggunaChrome.css. Fail ini membolehkan anda mengubah rupa mana-mana bahagian Firefox, serta fungsinya.

Sebelum menyelam ke dalam mengedit fail penggunaChrome.css, kami akan memasang add-on, dipanggil ChromEdit Plus, yang akan membolehkan kami dengan mudah mengedit fail dan menyimpannya dalam format yang betul. Klik pautan berikut untuk pergi ke halaman web ChromEdit Plus.

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

Klik butang Add to Firefox pada halaman.

Mesej berikut mungkin dipaparkan. Klik Benarkan untuk terus memasang tambahan ChromEdit Plus.

NOTA: Berhati-hati dengan apa yang anda benarkan apabila memasang pelanjutan dan perisian lain. Jika anda tidak pasti tentang produk atau tidak mempercayai syarikat itu, jangan pasang. Kami menguji ChromEdit Plus dan mendapati ia selamat dan boleh dipercayai.

Kotak dialog Pemasangan Perisian dipaparkan. Klik Pasang Sekarang, yang mungkin tidak tersedia sehingga pengiraan undian selesai.

NOTA: Anda boleh mengubah panjang undur pada butang Pasang, tetapi kami tidak mengesyorkan melumpuhkannya.

Anda mesti memulakan semula Firefox untuk menyelesaikan pemasangan. Klik Mula semula pada dialog pop timbul.

Setelah Firefox dimulakan semula, butang ChromEdit Plus ditambahkan di sebelah kanan kotak Alamat. Klik untuk membuka tetingkap ChromEdit Plus.

Terdapat tiga tab secara lalai pada tetingkap ChromEdit Plus. Kami akan mengedit fail userChrome.css, yang terdapat pada tab pertama. Jika tab kosong, salin dan tampal teks berikut ke tab penggunaChrome.css dan klik Simpan. Ini memberi anda fail penggunaChrome.css lalai.

@namespace url ("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
# appmenu-button
latar belakang: #orange! penting;

# penafsir butang aplikasi: sebelum
kandungan: "Firefox"! penting;
warna: #FFFFFF! penting;

# appmenu-button .button-text
paparan: tiada! penting;

Anda mungkin sudah mempunyai fail userChrome.css, dalam hal ini akan ada teks pada tab penggunaChrome.css. Salin semua teks di atas kecuali baris pertama, barisan ruang nama @ dan tampalkannya ke tab di suatu tempat selepas barisan @namespace. Jika anda ingin menyimpan apa yang anda sudah ada, anda boleh menyisipkan teks di atas pada akhir fail.

PENTING: Pastikan semua petikan di userChrome.css TIDAK sebut harga pintar, termasuk yang ada di dalam garis ruang nama @. Mereka harus biasa, petikan lurus. Jika mana-mana daripadanya adalah sebut harga pintar, fail tersebut tidak akan menjejaskan penampilan Firefox sama sekali.

Klik Mula semula untuk memulakan semula Firefox menggunakan fail penggunaChrome.css yang baru atau disemak.

Dalam contoh ini, kita akan menukar warna latar belakang kepada biru gelap dan menukar teks "Firefox" kepada "How-To Geek".

Untuk menukar warna latar belakang, tukar teks "#orange" pada baris "latar belakang" di bahagian "# app-menu" dengan warna yang berbeza, menggunakan kod warna hex, atau kod warna HTML. Sebagai contoh, kami memilih biru gelap dengan kod warna heks # 2C4362.

NOTA: Untuk mengetahui kod warna hex untuk warna yang anda mahu, lihat artikel kami tentang mendapatkan kod warna hex dari warna RGB perpuluhan, memilih warna dari mana saja di skrin, dan mendapatkan kod warna dalam pelbagai format.

Untuk menukar teks pada butang, ubah teks "Firefox" pada baris "kandungan" dalam bahagian "# appmenu-dropmarker: sebelum" ke teks yang anda suka, seperti "How-To Geek". Kami menambah ruang selepas teks mempunyai lebih banyak ruang antara teks dan anak panah jatuh ke atas butang.

Anda boleh memilih untuk menukar warna teks dengan juga menukar "warna" dalam bahagian "# appmenu-dropmarker: sebelum" yang sama. Kami meninggalkan warna teks sebagai putih (#FFFFFF), tetapi anda boleh mengubahnya kepada sesuatu seperti kelabu muda (# F2F2F2), atau sesuatu seperti itu.

Klik Simpan dan kemudian mulakan semula untuk melaksanakan perubahan.

Butang kini berwarna biru tua dan berkata "How-To Geek".

Anda juga boleh menambah imej latar belakang pada butang, selain menukar warna latar belakang. Kami mencipta imej yang mempunyai favicon How-To Geek di sebelah kiri dan latar belakang telus supaya warna latar biru gelap menunjukkan. Untuk menambah imej latar belakang pada butang anda, tambah baris berikut ke bahagian "# appmenu-button", ubah laluan di petikan ke lokasi imej anda pada komputer anda. Biarkan "fail: ///" dalam laluan.

background-image: url ("fail: /// C: /Users/Lori/Pictures/htg_background.png")! penting;

Klik Simpan dan Mulakan semula.

Sekarang butang kami selesai.

Anda juga boleh menyesuaikan butang menu Firefox dengan menukarnya menjadi ikon. Kami juga telah menerbitkan banyak petua dan tweak lain untuk memanfaatkan sepenuhnya Firefox.