How to customize Firefox menu button?

好啦，原本寫著 Firefox 的橘色按鈕也不是說醜

但看久了真得很膩

上次在 JSDC.tw 聽到阿土伯提到 XUL 跟 Gecko 是兄弟檔後

就想來玩玩了 userchrome.css

昨天心血來潮研究一下

發現真的只是css語法 (難怪 Firefox 佈景主題多到炸

很簡單的

首先

先下載這個 Add-on: ChromEdit, 連結如下

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

選擇 Add to Firefox

安裝完成後忘了要不要重新啟動

工具->ChromEdit Plus->ChromEdit

進入 userchrome.css 的tab

開始玩css囉

語法不會可以自行 Google

以下附上我的範例 code

#appmenu-button {
background: black !important;
padding-bottom:3px !important;
padding-top:3px !important;
box-shadow: none !important;
background-image: url("http://www.csie.ntu.edu.tw/~b98902037/firefox_icon_by_samnung-d2yb92p.png") !important;
background-size: contain !important;
background-repeat: no-repeat !important;
}
#appmenu-button:hover{
box-shadow: none !important;
}
#appmenu-button dropmarker:before {
content: "Dayo " !important;
color: #FFFFFF !important;
}
#appmenu-button .button-text {
display: none !important;
}
要讓它消失只要來個 display:none 即可

改完後 Save->Restart

就可以看到樣式改變了

以上範例出來會長這樣

用自己的名字，就是爽

版權沒有，歡迎翻印