Firefox 一分鐘教室-userChrome.css
出自 MozTW Wiki
userChrome.css 設置了Firefox用戶瀏覽器界面中可變元素的顯示規則。
內容大綱
建立userChrome.css
- 到Profiles下的 \chrome\ 子目錄裡，新建一個userChrome.css。
- 以Notepad或WordPad開啟userChrome.css
- 將以下內容貼進去後，存檔。
/*
* Do not remove the @namespace line -- it's required for correct functioning
*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
自訂自己的瀏覽器界面
Firefox 一分鐘教室-縮放字體大小
- 修改瀏覽器界面的字體大小
- 以Notepad或WordPad開啟userChrome.css
- 把
*{font-size: 14pt !important}
- 貼進去。(14pt可以改成15pt、20pt、或其它你想要的值)
- 3. 將此檔案存檔，最後把Firefox關掉，重開一次。
設定搜尋列寬度
/* 設定搜尋列寬度 */
#search-container, #searchbar {
min-width: 10px !important;
width: 100px !important;}
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。(100px可以改成70px、200px、或其它你想要的值)
隱藏選單列
不使用時，隱藏選單列(Compact Menu套件效果)
/*不使用時，隱藏選單列 Sliding Menubar*/
#menubar-items { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsSAAALEgHS3X78AAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAEJElEQVR42mL8//8/g56kvvbvf4wfrr+88JQBCDiNaoSY/v4M+sfMbgriSwp+eK3Lf/qDHO8n11u3mS8fOclQ9/XvlW8gOYAAYgERZSlGi1TUtaQc7NK0rn3nmxBsyBlnqybAcP2XLMN7bmmGV68/Mry6ycOwMHT/f34eZrclO7kiZXh0Y558ubwfIIAYQS44OqXgjYGloTDTi+0MjEysDD9EgxhmHv7AwKFuwMAoLMHw5x8Dw9effxjET9YxpJpdZ/jLwMKw9yzzp+j6d/YAAQBBAL7/AiASNBEA+eoCBvXTAAAD/AD6AyYA/9+2APTNngDDu74A2Ov1AOPy+QDx+v4Azyx9AJDOOgADAPwARzb6Di4hAmUCiDnOWas1zovf6fe3Fwx/Xj1m+PvuNcNfZlkGczV5hiWnXzKc59FieP7lD8PXX38ZfgKdcuqbHIMf2y4Gbk5gWP1nkgUIAEEAvv8EEQPzJf/u4QD9AQQA/fL1AAL8/gAOCOcAlM4CAMQWUgD87/gABQP6AOYFAQATCgUA9/X+AN/qAgAWE/8AQCwEFQIAQQC+/wTt9f0D/ezvAP4FAAD8+P8A6N72AH647gDHDDMA/SgQAAD8/AD7/gIA7/wBAPn7/QD829UA7CT9AAAsBACw0QYDAojp64MPwn9eAw349o3h21dmBmZWFgZ93rcMHDx8DOuepzJU3ahk4L9+mOHvv78Mn7//ZuB9fY3BU+0/0P0cDNzifxkAAgBBAL7/AuDqBOLz4PMAAPLyAAwMBwARIxwAbDUFAMIhpgA7EekAcB3SADLyzgAA/P0AAff1ACb/4AACIgwAAAsHAPXpAwACAEEAvv8C2fcBotTV/AD96/YABP7qAAz/7AAB/fcAuMz0AFu/LAAd1W0AwDBoAAL39QBIzpEAmEHnAAAZLQD++QAAjrPxswIAQQC+/wP0/uzd7vgXbTz/8wkGEv0ABQ8NAAH25AAUEgwAwfETAO0EFAAV5M8Aae6oAJpK8AAVUC8AAO/9AIKH1QCzyPVVAgickLgFzPLrf1ye4K71g4HXQpBBUI4d6OT/DGxfuBn+/vrP8A8YkEzsTAzMOn8Z2OUUGM5u/MjgsoTryJe3Jx0BAghsACMjI7egkMXe4o+XzF15vjFwqjAx8KhyM/CKczMwsjEA0x0bAyPrfwYOuX8Mu85wMyRt4X/4+sVpc6DelwABBDOAEZglRNjEHWcbfH3mH/btIYPmvx8MQEsZ2MUYGdhVWBhesPMyzH8qwrD9g8TFHy8OhQLVPwDq/Q0QQGADQABoBlA5gyATl5QpC596LdAT+lz//nIzMvxn+MbE+usHI8vTf38/zvrz6uQyoLoXQH2/QPoAAghuAAwADeIAuQaIRYGYl4lLgu/ftxevgew3QPwKiL8C9fyDqQcIMACDoJbT47bbfAAAAABJRU5ErkJggg==") !important;
background-repeat: no-repeat !important;
background-position: 5px center !important;
padding-left: 24px !important;
}
#menubar-items > #main-menubar {
display: none !important;
}
#menubar-items:hover > #main-menubar {
display: -moz-box !important;
}
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。
- 參見http://userstyles.org/style/show/993
永遠隱藏選單列
/*隱藏選單列*/
#toolbar-menubar
{ display: none !important }
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。
隱藏書籤裡的"全部同時開啟"
- 把
/*隱藏書籤裡的"全部同時開啟"*/
menuitem[class="openintabs-menuitem"], menuseparator[class="openintabs-menuseparator"]
{ display: none !important; }
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。
隱藏右鍵選單裡的項目
隱藏用新視窗開啟鏈結
#context-openlink{ display: none !important; }/*隱藏用新視窗開啟鏈結*/
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。
隱藏郵寄...
#context-sendlink, /*郵寄此鏈結*/
#context-sendpage, /*郵寄網址*/
#context-sendimage /*郵寄此圖片*/
{ display: none !important; }
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。
隱藏翻頁,重載,停止
#context-back, /*上一頁*/
#context-forward, /*下一頁*/
#context-reload, /*重新載入*/
#context-stop /*停止*/
{ display: none !important; }
- 貼進userChrome.css，將此檔案存檔，把Firefox關掉，重開一次。
隱藏...
- 參見http://kb.mozillazine.org/Chrome_element_names_and_IDs
找到想要的元素的id
- Firefox，它的介面架構是使用一個稱為 DOM 的樹狀結構來表示，你可以在安裝Firefox的時候，使用 [自訂安裝] 即可選擇一個稱為 "DOM Inspector" 的套件來安裝。這個套件的功能正如其名: 它能讓您輕易的觀察 DOM 的樹狀結構。有安裝的話，就可以在 [工具] 選單下找到它。
- 執行 "DOM 觀察器"，
- 主選單->檔案->觀察視窗...。這裡會列出所有目前 Firefox 已開啟的視窗標題，選取第一個表示我們想要觀察 Firefox 主視窗。
- 接下來按下 DOM 觀察器的工具列上第一個按鈕(它的描述是"選擇節點以觀察之")。
- 按一下後拿滑鼠去點 Firefox 主選單上的 "瀏覽(G)"，您會看見該項目周邊閃紅框表示指定成功！
- 回到 DOM 觀察器就可以看到，它已經找到並展開您剛點取的 "瀏覽(G)" 在 DOM 中的位置。
- 右方窗格中您可以看到該 Node 的詳細資訊。
- 使用 DOM 觀察器，這是找出介面上您想要元素資訊的一個好方法。而在進行 Overlay 時，其實可以用來指定的不只是 id，您可以用該元素的任何屬性來指定。
隱藏無ID物件
- 用它的 src
menuitem[src="chrome://XXX"] { display: none !important; }
- 隨便又方便的方法，可能有副作用；只要它有特殊的屬性, 就可以利用這屬性來隱藏它。
美化
小狐貍
維基娘
參見
‧返回上一頁: Firefox 一分鐘教室
