Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Firefox 2 佈景主題之更動

本文件正在翻譯中,請協助翻譯。

原文 / 參考

本文涵括使佈景主題相容 Firefox 2 的各種修改須知。


與瀏覽器更動相關

瀏覽器中有許多更動甚至刪除的檔案,所以佈景主題可能需要修改才能正確套用。此表格列出 XUL 及相對應的 CSS 檔案更動處,供您編修查照。

檔案名稱 CSS 檔 細節
<tt>feeds/addFeedReader.xul</tt> <tt> feeds/addFeedReader.css </tt> 新檔案,提供添加新消息來源閱讀工具的使用介面。
<tt>feeds/subscribe.xhtml</tt> <tt>feeds/subscribe.css</tt> 新檔案,提供訂閱消息來源(RSS)的介面。
<tt>preferences/downloads.xul</tt> - 自 Firefox 2 起移除。
<tt>preferences/general.xul</tt> - 自 Firefox 2 起移除。
<tt>safebrowsing/warning-overlay.xul</tt> <tt>safebrowsing/browser-protection.css</tt> 新檔案,為使用者瀏覽疑似詐騙網站時覆蓋瀏覽器的警告介面。
<tt>search/engineManager.xul</tt> <tt> engineManager.css</tt> 新檔案,為搜尋引擎管理員視窗的介面。

預設佈景主題的更動

以下列出 Firefox 2 預設佈景主題的變動之處,您可依循本表找出該修改的地方。

檔案 變動描述
<tt>browser/bookmarks/addBookmark.css</tt> 加入與即時摘要相關的 CSS 更動部份。
<tt>browser/bookmarks/bookmarksProperties.css</tt> 新檔案,內含與即時摘要相關的 CSS。
<tt>browser/browser.css</tt> 需為即時摘要、搜尋欄、書籤選單項目圖示及其他部分修改之。
<tt>browser/dropmark-nav-small.png</tt> 新檔案,為使用小圖示時上下一頁旁的下拉選單圖示。
<tt>browser/dropmark-nav.png</tt> 新檔案,為上下一頁旁的下拉選單圖示。
<tt>browser/engineManager.css</tt> 新檔案,搜尋引擎管理員所用的 CSS。
<tt>browser/feeds/addFeedReader.css</tt> 新檔案,新增消息來源閱讀工具的視窗所用之 CSS。
<tt>browser/feeds/feedIcon.png</tt> 新檔案,RSS 圖示。
<tt>browser/feeds/feedIcon16.png</tt> 新檔案,RSS 圖示的 16x16 像素版。
<tt>browser/feeds/subscribe.css</tt> 新檔案,訂閱消息來源時視窗的 CSS。
<tt>browser/Go-rtl.png</tt> 新檔案,網址列尾端的「Go」三角箭頭圖示。
<tt>browser/preferences/preferences.css</tt> 選項視窗的樣式檔。
<tt>browser/safebrowsing/browser-protection.css</tt> 新檔案,控制瀏覽疑似詐騙網站時出現的警告訊息及網址列圖示樣式。
<tt>browser/safebrowsing/close16x16.png</tt> 新檔案,詐騙網站警告視窗的關閉鈕。
<tt>browser/safebrowsing/dim.png</tt> 新檔案,瀏覽疑似詐騙網站時,會覆蓋在整個頁面上使頁面內容變暗的檔案,應為半透明圖以便使用者辨識頁面的內容。
<tt>browser/safebrowsing/tail.png</tt> 新檔案,詐騙網站警告視窗的「尾巴」,藉以製成談話泡泡的樣子。
<tt>browser/safebrowsing/warning16x16.png</tt> 新檔案,網址列詐騙網站警告圖示的 16x16 像素版。.
<tt>browser/safebrowsing/warning24x24.png</tt> 新檔案,此為顯示於詐騙網站警告視窗中的圖示。
<tt>browser/search-bar-background-mid.png</tt> 新檔案,搜尋欄中間的背景。搜尋欄本身及尾端的圖已經拆開分別繪製。
<tt>browser/search-bar-background.png</tt> 已移除。
<tt>browser/Search-bar.png</tt> 已移除。
<tt>browser/Search-go-rtl.png</tt> 新檔案,搜尋欄的搜尋圖示,此為顯示於左側的版本。
<tt>browser/Search-go.png</tt> 新檔案,搜尋欄右側的搜尋圖示。
<tt>browser/Search-provider-bkgnd-rtl.png</tt> New file; the background drawn behind the search provider icon when it's located at the left end of the search bar.
<tt>browser/Search-provider-bkgnd.png</tt> New file; the background drawn behind the search provider icon when it's located at the right end of the search bar.
<tt>global/about.css</tt> New file; CSS used in the application's about box.
<tt>global/alltabs-box-bkgnd.png</tt> New file; the background for the "all tabs" drop-down menu at the right side of the tab bar.
<tt>global/alltabs-box-overflow-bkgnd.png</tt> New file; the background for the "all tabs" drop-down menu when there are enough tabs to activate tab bar scrolling.
<tt>global/browser.css</tt> Revised to support new styles for the main browser window.
<tt>global/globalBindings.xml</tt> Updated to support changes to the tab bar, including per-tab close buttons.
<tt>global/icons/alltabs.png</tt> Not actually used; left over from earlier drafts of the theme.
<tt>global/inactivetab-left.png</tt> 已移除。
<tt>global/inactivetab-right.png</tt> 已移除。
<tt>global/menu.css</tt> Updated to include new styles.
<tt>global/notification.css</tt> New file; defines styles used by the notification strip that appears at the top of browser windows to present notices such as "a popup was blocked."
<tt>global/scrollbox/autorepeat-arrow-dn-dis.gif</tt> New file; icon displayed for a disabled autorepeat down arrow in a scroll box.
<tt>global/scrollbox/autorepeat-arrow-dn.gif</tt> New file; icon displayed for an autorepeat down arrow in a scroll box.
<tt>global/scrollbox/autorepeat-arrow-up-dis.gif</tt> New file; icon displayed for a disabled autorepeat up arrow in a scroll box.
<tt>global/scrollbox/autorepeat-arrow-up.gif</tt> New file; icon displayed for an autorepeat up arrow in a scroll box.
<tt>global/scrollbox.css</tt> Needs to be updated to include new styles.
<tt>global/tab-arrow-end-bkgnd.png</tt> New file; the background for the scrolling tab bar arrow at the right side of the tab bar.
<tt>global/tab-arrow-end.png</tt> New file; the arrow drawn in the scrolling tab bar box at the right end of the tab bar.
<tt>global/tab-arrow-start-bkgnd.png</tt> New file; the background for the scrolling tab bar arrow at the left side of the tab bar.
<tt>global/tab-arrow-start.png</tt> New file; the arrow drawn in the scrolling tab bar box at the left end of the tab bar.
<tt>global/tab-left.png</tt> 新檔案,為分頁標籤的左緣。
<tt>global/tab-middle.png</tt> 新檔案,為分頁標籤中間部分。
<tt>global/tab-right.png</tt> 新檔案,為分頁標籤的右緣。
<tt>global/tabbrowser-tabs-bkgnd.png</tt> 新檔案,為分頁列上標籤後方的背景圖。
<tt>global/toolbar.css</tt> 需更新,將新的樣式資訊加入。
<tt>mozapps/extensions/about.css</tt> Updated with a simplified set of style names, since several styles were identical.
<tt>mozapps/extensions/extensions.css</tt> CSS for the add-ons manager window. Updated to support the new features of the Firefox 2 add-ons manager.
<tt>mozapps/extensions/itemDisabledFader.png</tt> New file; a translucent PNG used as an overlay on top of items that are disabled in the add-ons manager.
<tt>mozapps/extensions/itemEnabledFader.png</tt> New file; a translucent PNG used as an overlay on top of items that are enabled in the add-ons manager.
<tt>mozapps/extensions/notifyBadges.png</tt> New file; contains the icons used ito badge the icons for add-ons in the add-on manager window to indicate their status. These look like this in the default theme:

Image:notifyBadges.png

  • The first icon (green here) indicates that an add-on has an update available.
  • The second icon (yellow here) appears to be used for blocklisted items; trying to confirm.
  • The third icon (red here) indicates that an add-on is disabled, either by the user or because it's incompatible with the application.
  • The fourth icon (blue here) (not sure what this one means).
<tt>mozapps/extensions/question.png</tt> New file; used in the Add-ons Manager when you check for updates. If no updates are found, this icon is displayed at the left side of the message strip that appears across the top of the window.
<tt>mozapps/extensions/update.css</tt> 本檔案為更新精靈的樣式,其中的樣式資訊因應重新設計的更新精靈而較之前少。
<tt>mozapps/extensions/viewButtons.png</tt> New file; contains icons for each of the views that may be available in the add-ons manager. In the default theme, these look something like this:

Image:viewButtons.png
The top row contains dimmed versions of the icons below them. The first icon is for the extensions view. The second is for themes. The third is for locales, the fourth is for plugins, the fifth is for updates, and the sixth is for installs.

<tt>mozapps/pref</tt> Firefox 2 已經用不到這個目錄了,應予移除。

Changes in <tt>browser</tt>

<tt>bookmarks/addBookmark.css</tt>

<tt>addBookmarks.css</tt> 檔的最開頭應該加上下列幾行:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");

還有些與即時摘要相關的 CSS 也要加上,以便調整即時摘要選取工具的樣式。這個選取工具僅在頁面有即時摘要時才以可編輯式下拉選單呈現,否則就長得跟一般文字輸入區相同。

  • menulist#name[droppable="false"]
  • menulist#name[droppable="false"] > .menulist-editable-box
  • menulist#name[droppable="false"] > .menulist-editable-box > html|*.textbox-input
  • menulist#name[droppable="false"] > .menulist-dropmarker
  • menulist#name[droppable="false"] > menupopup

此檔案將為 <tt> addBookmark2.xul</tt> 調整樣式。

<tt>bookmarks/bookmarksProperties.css</tt>

這是 Firefox 2 新增的檔案,其 CSS 碼應該跟你剛才加到 <tt>addBookmark.css</tt> 裡的一樣。此檔案為 <tt>bookmarksProperties.xul</tt> 調整樣式。

註: 這個 CSS 應該會另外開一篇檔案展示範例內容,以便往後其他相關文件參照。

<tt>browser.css</tt>

以下是 Firefox 2 之後不再使用的樣式,應予移除:

  • #bookmarks-button:active
  • #copy-button:active
  • #cut-button:active
  • #downloads-button:active
  • #forward-button[buttondown="true"]
  • #history-button:active
  • #home-button:active
  • #mail-button
  • #mail-button:active
  • #mail-button[disabled="true"]
  • #mail-button[open="true"]
  • #new-tab-button:active
  • #new-tab-button[checked="true"]
  • #new-window-button:active
  • #new-window-button[checked="true"]
  • #paste-button:active
  • #print-button:active
  • #reload-button:active
  • #stop-button:active
  • .messageButton
  • .messageImage
  • .messageText
  • browsermessage
  • toolbar[iconsize="small"] #bookmarks-button:active
  • toolbar[iconsize="small"] #copy-button:active
  • toolbar[iconsize="small"] #cut-button:active
  • toolbar[iconsize="small"] #downloads-button:active
  • toolbar[iconsize="small"] #history-button:active
  • toolbar[iconsize="small"] #home-button:active
  • toolbar[iconsize="small"] #mail-button
  • toolbar[iconsize="small"] #mail-button:active
  • toolbar[iconsize="small"] #mail-button[disabled="true"]
  • toolbar[iconsize="small"] #mail-button[open="true"]
  • toolbar[iconsize="small"] #new-tab-button:active
  • toolbar[iconsize="small"] #new-window-button:active
  • toolbar[iconsize="small"] #paste-button:active
  • toolbar[iconsize="small"] #print-button:active
  • toolbar[iconsize="small"] #reload-button:active
  • toolbar[iconsize="small"] #stop-button:active
  • toolbar[mode="icons"] .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > stack > toolbarbutton > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-icon

而以下是 Firefox 2 佈景主題應加上的樣式:

  • #back-button .toolbarbutton-menubutton-dropmarker
  • #back-button:hover
  • #back-button:hover .toolbarbutton-menubutton-dropmarker
  • #back-button:hover:active
  • #back-button:hover:active .toolbarbutton-menubutton-dropmarker
  • #back-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • #back-button[buttonover="true"]
  • #back-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • #back-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • #back-button[open="true"]
  • #bookmarks-button:hover
  • #bookmarks-button:hover:active
  • #bookmarks-button[checked="true"]
  • #copy-button:hover
  • #copy-button:hover:active
  • #cut-button:hover
  • #cut-button:hover:active
  • #downloads-button:hover
  • #downloads-button:hover:active
  • #feed-button[chromedir="rtl"][feeds]:active
  • #feed-button[chromedir="rtl"][feeds]:hover
  • #feed-button[feeds]:active
  • #feed-button[feeds]:hover
  • #forward-button .toolbarbutton-menubutton-dropmarker
  • #forward-button:hover
  • #forward-button:hover .toolbarbutton-menubutton-dropmarker
  • #forward-button:hover:active
  • #forward-button:hover:active .toolbarbutton-menubutton-dropmarker
  • #forward-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • #forward-button[buttonover="true"]
  • #forward-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • #forward-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • #go-button:hover
  • #go-button[chromedir="rtl"]
  • #history-button:hover:active
  • #history-button:hover:active
  • #history-button[checked="true"]
  • #home-button:hover
  • #home-button:hover:active
  • #new-tab-button:hover
  • #new-tab-button:hover:active
  • #new-window-button:hover
  • #new-window-button:hover:active
  • #paste-button:hover
  • #paste-button:hover:active
  • #print-button:hover
  • #print-button:hover:active
  • #reload-button:hover
  • #reload-button:hover:active
  • #searchbar[empty="true"] .searchbar-textbox
  • #stop-button:hover
  • #stop-button:hover:active
  • #urlbar-icons-spacer
  • #urlbar-spacer
  • #urlbar[level="high"] #lock-icon:active
  • #urlbar[level="high"] #lock-icon:hover
  • #urlbar[level="low"] #lock-icon:active
  • #urlbar[level="low"] #lock-icon:hover
  • .autocomplete-treebody::-moz-tree-cell(suggesthint)
  • .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
  • .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment)
  • .bookmark-item[livemark]
  • .openintabs-menuitem
  • .toolbarbutton-icon
  • .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button:hover
  • toolbar[iconsize="small"] #back-button:hover .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button:hover:active
  • toolbar[iconsize="small"] #back-button:hover:active .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #bookmarks-button:hover
  • toolbar[iconsize="small"] #bookmarks-button:hover:active
  • toolbar[iconsize="small"] #copy-button:hover
  • toolbar[iconsize="small"] #copy-button:hover:active
  • toolbar[iconsize="small"] #cut-button:hover
  • toolbar[iconsize="small"] #cut-button:hover:active
  • toolbar[iconsize="small"] #downloads-button:hover
  • toolbar[iconsize="small"] #downloads-button:hover:active
  • toolbar[iconsize="small"] #forward-button .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button:hover
  • toolbar[iconsize="small"] #forward-button:hover .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button:hover:active
  • toolbar[iconsize="small"] #forward-button:hover:active .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #history-button:hover
  • toolbar[iconsize="small"] #history-button:hover:active
  • toolbar[iconsize="small"] #home-button:hover
  • toolbar[iconsize="small"] #home-button:hover:active
  • toolbar[iconsize="small"] #home-button[disabled="true"]
  • toolbar[iconsize="small"] #new-tab-button:hover
  • toolbar[iconsize="small"] #new-tab-button:hover:active
  • toolbar[iconsize="small"] #new-window-button:hover
  • toolbar[iconsize="small"] #new-window-button:hover:active
  • toolbar[iconsize="small"] #paste-button:hover
  • toolbar[iconsize="small"] #paste-button:hover:active
  • toolbar[iconsize="small"] #print-button:hover
  • toolbar[iconsize="small"] #print-button:hover:active
  • toolbar[iconsize="small"] #reload-button:hover
  • toolbar[iconsize="small"] #reload-button:hover:active
  • toolbar[iconsize="small"] #stop-button:hover
  • toolbar[iconsize="small"] #stop-button:hover:active
  • toolbarbutton.bookmark-item-microsummarized

可能還有其他的樣式也要一併修改一下。

<tt>searchbar.css</tt>

以下是 Firefox 2 不再使用的樣式,應予移除:

  • .searchbar-dropmarker

以下是 Firefox 2 應加上的樣式:

  • #search-container[chromedir="rtl"] .search-go-button
  • #search-container[chromedir="rtl"] .searchbar-engine-button
  • .search-go-button
  • .search-go-button:hover
  • .search-go-button:hover:active
  • .search-go-button[disabled="true"]
  • .searchbar-engine-button
  • .searchbar-engine-button:hover
  • .searchbar-engine-button[addengines="true"]
  • .searchbar-engine-button[open="true"]
  • .searchbar-engine-menuitem[selected="true"] > .menu-iconic-text
  • .searchbar-left

同樣的,你可能也需要更動其他部分。

<tt>preferences/preferences.css</tt>

以下是 Firefox 2 不再使用的樣式,應予移除:

  • #browserStartupHomepage
  • #browserStartupHomepage
  • #paneDownloads description
  • #paneGeneral description
  • radio[pane=paneDownloads]
  • radio[pane=paneDownloads]:active

以下是 Firefox 2 佈景主題應加上的樣式:

  • #paneContent description
  • #paneMain description
  • #paneSecurity description
  • radio[pane=paneAdvanced]:hover
  • radio[pane=paneAdvanced][selected="true"]
  • radio[pane=paneContent]:hover
  • radio[pane=paneContent][selected="true"]
  • radio[pane=paneFeeds]
  • radio[pane=paneFeeds]:active
  • radio[pane=paneFeeds]:hover
  • radio[pane=paneFeeds][selected="true"]
  • radio[pane=paneGeneral]:hover
  • radio[pane=paneGeneral][selected="true"]
  • radio[pane=paneMain]
  • radio[pane=paneMain]:active
  • radio[pane=paneMain]:hover
  • radio[pane=paneMain][selected="true"]
  • radio[pane=panePrivacy]:hover
  • radio[pane=panePrivacy][selected="true"]
  • radio[pane=paneSecurity]
  • radio[pane=paneSecurity]:active
  • radio[pane=paneSecurity]:hover
  • radio[pane=paneSecurity][selected="true"]
  • radio[pane=paneTabs]:hover
  • radio[pane=paneTabs][selected="true"]

你依然可能得修改其他部分。

<tt>feeds/addFeedReader.css</tt>

這是 Firefox 2 中的新檔案,用於調整新增消息來源閱讀工具視窗樣式,即 <tt>browser/feeds/addFeedReader.xul</tt>。

  • #imageBox
    • 顯示消息來源圖示的區塊。
  • #content
    • 視窗內容的樣式資訊。
  • #siteLabel
    • 網站文字的樣式。

<tt>feeds/subscribe.css</tt>

這是 Firefox 2 的新檔案,用以調整訂閱消息來源視窗的樣式,即 <tt>browser/feeds/subscribe.xhtml</tt>。

  • #application
  • #feedBody
  • #feedChangeSubscribeOptions
  • #feedError
  • #feedHeader
  • #feedHeader[firstrun="true"]
  • #feedHeader[firstrun="true"] #feedIntroText
  • #feedHeader[firstrun="true"] #feedSubscribeLine
  • #feedIntroText
  • #feedSubscribeDoneChangingOptions
  • #feedSubscribeHandleText
  • #feedSubscribeHandler
  • #feedSubscribeLine
  • #feedSubscribeOptions
  • #feedSubscribeOptionsGroup
  • #feedSubscribeOptionsGroupTitle
  • #feedTitleContainer
  • #feedTitleImage
  • #feedTitleLink
  • #readerContainer
  • #readerGroup
  • #readers
  • #readers > listitem
  • .feedEntryContent
  • .feedSubscribeButton
  • .feedSubscribeButton .button-icon
  • .feedSubscribeLink
  • .feedSubscribeLinkBox
  • .field
  • .link
  • .link:hover:active
  • .plain
  • .plain > .button-box
  • .plain:focus > .button-box
  • .styleLessBorderLess

預設佈景主題中也含有 a[href] imgbodyh1h2html 等樣式規則。

<tt>safebrowser/browser-protection.css</tt>

這個 Firefox 2 的新檔案用以調整偵測詐騙網站功能的樣式。下列樣式一定要設定好、在使用者碰上疑似詐騙網站時提醒他們:

  • #safebrowsing-dim-area-canvas
  • #safebrowsing-page-canvas
  • #safebrowsing-palm-close
  • #safebrowsing-palm-close-container
  • #safebrowsing-palm-google-logo
  • #safebrowsing-palm-message
  • #safebrowsing-palm-message-actionbox
  • #safebrowsing-palm-message-content
  • #safebrowsing-palm-message-tail
  • #safebrowsing-palm-message-tail-container
  • #safebrowsing-palm-message-titlebox
  • .safebrowsing-palm-bigtext
  • .safebrowsing-palm-fixed-width
  • .safebrowsing-palm-paragraph
  • .safebrowsing-palm-smalltext

而以下樣式則調整碰上疑似詐騙網站時網址列的小圖示,安全跟警告各有不同:

  • #safebrowsing-urlbar-icon
  • #safebrowsing-urlbar-icon[level="safe"]
  • #safebrowsing-urlbar-icon[level="warn"]

<tt>engineManager.css</tt>

此檔案為 Firefox 2 新增,要調整的樣式如下:

  • #engineList treechildren::-moz-tree-image(engineName)

Changes in <tt>global</tt>

<tt>about.css</tt>

此檔案為 Firefox 2 新增、用以調整「關於 Mozilla Firefox」視窗的樣式。檔案中至少要有下列樣式資訊:

  • #aboutLogoContainer
  • #aboutPageContainer
  • #version

預設的佈景主題則額外調整了 bodyhtmlimgulul > li

<tt>browser.css</tt>

Firefox 2 已不使用下列樣式,應予移除:

  • tab:focus
  • tab[beforeselected="true"] > .tab-image-right
  • tab[selected="true"] > .tab-image-left
  • tab[selected="true"] > .tab-image-middle
  • tab[selected="true"] > .tab-image-right

而以下則是 Firefox 2 佈景主題該新增的樣式:

  • .alltabs-item > .menu-iconic-left > .menu-iconic-icon
  • .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon
  • .alltabs-item[selected="true"]
  • .tab-close-button
  • .tab-close-button > .toolbarbutton-icon
  • .tab-close-button-placeholder
  • .tab-close-button:hover
  • .tab-close-button:hover:active
  • .tabbrowser-arrowscrollbox > .scrollbutton-down
  • .tabbrowser-arrowscrollbox > .scrollbutton-down:hover
  • .tabbrowser-arrowscrollbox > .scrollbutton-up
  • .tabbrowser-arrowscrollbox > .scrollbutton-up:hover
  • .tabbrowser-tab > .tab-close-button
  • .tabbrowser-tab:not([selected="true"]) > .tab-close-button
  • .tabbrowser-tab:not([selected="true"]):hover > .tab-close-button
  • .tabbrowser-tab[selected="true"] > .tab-close-button
  • .tabbrowser-tab[selected="true"] > .tab-close-button:hover
  • .tabbrowser-tab[selected="true"] > .tab-close-button:hover:active
  • .tabbrowser-tabs[overflow="true"] .tabs-alltabs-box
  • .tabs-alltabs-box
  • .tabs-alltabs-box:hover
  • .tabs-alltabs-box[flash="true"]
  • tab > .tab-image-left
  • tab > .tab-image-middle
  • tab > .tab-image-middle > .tab-text
  • tab > .tab-image-right
  • tab:focus > .tab-image-middle > .tab-text
  • tab:hover:not([selected="true"]) > .tab-image-left
  • tab:hover:not([selected="true"]) > .tab-image-middle
  • tab:hover:not([selected="true"]) > .tab-image-right
  • tab:not([selected="true"]) > .tab-image-left
  • tab:not([selected="true"]) > .tab-image-middle
  • tab[selected="true"] .tab-image-middle > .tab-text

除此之外,依然可能要調整相關的樣式。

<tt>menu.css</tt>

這是 Firefox 2 用不上的樣式,應予刪除:

  • menulist > menupopup > menuitem[_moz-menuactive="true"]

而 Firefox 2 佈景主題還應該加上下列樣式:

  • .menu-iconic-icon
  • menubar > menu
  • menubar > menu[_moz-menuactive="true"][open="true"]
  • menuitem[type="checkbox"] > .menu-iconic-left
  • menuitem[type="radio"] > .menu-iconic-left

若有相關樣式,可能得另外調整。

<tt>notification.css</tt>

此外 Firefox 2 新增的檔案,用以調整阻擋彈出視窗、提示安裝 plugin 等的訊息列樣式。至少應定義下列樣式:

  • .messageButton
  • .messageCloseButton
  • .messageImage
  • .messageText
  • .notification-inner
  • notification
  • notification[type="info"]
  • notification[type="warning"]
  • notification[type="critical"]

<tt>scrollbox.css</tt>

請為 Firefox 2 佈景主題的這個檔案加上下列樣式:

  • .autorepeatbutton-down[disabled="true"]
  • .autorepeatbutton-down[orient="horizontal"]
  • .autorepeatbutton-down[orient="horizontal"][disabled="true"]
  • .autorepeatbutton-up[disabled="true"]
  • .autorepeatbutton-up[orient="horizontal"]
  • .autorepeatbutton-up[orient="horizontal"][disabled="true"]
  • .scrollbutton-down
  • .scrollbutton-down > .toolbarbutton-text
  • .scrollbutton-down[disabled="true"]
  • .scrollbutton-down[orient="horizontal"]
  • .scrollbutton-down[orient="horizontal"][disabled="true"]
  • .scrollbutton-up
  • .scrollbutton-up > .toolbarbutton-text
  • .scrollbutton-up[disabled="true"]
  • .scrollbutton-up[orient="horizontal"]
  • .scrollbutton-up[orient="horizontal"][disabled="true"]

You may wish to make changes to other styles as well.

  • toolbar[mode="icons"] .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > stack > toolbarbutton > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-icon

或許也要更動其他相關的部分。

<tt>mozapps</tt> 更動處

<tt>extensions/about.css</tt>

Firefox 2 已經用不著以下樣式了,應予刪除:

  • #contributorsBox
  • #creatorBox
  • #extensionContributors
  • #extensionContributors
  • #extensionCreatorLabel

此外應新增下列樣式:

  • .indent
  • .sectionTitle

其他關聯的樣式也可能需要變動。

<tt>extensions/update.css</tt>

Firefox 2 已經用不著以下樣式了,應予刪除:

  • #foundList
  • #statusbar-updates
  • .updateCategoryBox
  • .updateCategoryContent
  • .updateCategoryIcon
  • .updateCategoryLabel[selected="true"]
  • .updateIcon
  • .updateIcon[severity="0"]
  • .updateIcon[severity="1"]
  • .updateIcon[severity="2"]
  • .updateIndicator > label
  • .updateIndicator[updateCount="0"]
  • .updateItemChecked
  • .updateItemChecked .checkbox-label-box
  • .updateItemFromLabel
  • .updateItemIcon
  • .updateItemIcon
  • .updateItemName
  • .updateItemNameRow
  • .updateItemURL
  • .warning
  • radio[type="update-type"]
  • radiogroup[type="update-types"]
  • toolbarbutton[type="updates"]
  • toolbarbutton[type="updates"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][severity="0"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][severity="1"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][severity="2"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][updateCount="0"]
  • updateitem

此外應新增下列樣式:

  • .alertBox
  • .throbber

文件標籤與貢獻者

 此頁面的貢獻者: Mgjbot, BobChao
 最近更新: Mgjbot,