舊文件

此處文件僅供參考，請自行考量時效性與適用程度，其他庫藏文件請參考文件頁面；
我們亟需您的協助，進行共筆系統搬移、及文件整理工作，詳情請查閱參與我們。

「針對特定網站設立樣式」修訂間的差異

出自 MozTW Wiki

（編寫/翻譯中...）
 
（完成）
行 1： 行 1：
−
Mozilla Firefox 1.5 有新增了一個 CSS 功能允許使用者為特定網站設立自訂樣式。blah blah
+
Mozilla Firefox 1.5 有新增了一個樣式表功能允許使用者為特定網站或網頁設立樣式，指定方式有網域名、完整位址、與位址前段三個。
  
 
== 編輯自訂樣式檔 ==
 
== 編輯自訂樣式檔 ==
  
−
== CSS 語法 ==
+
# 要編輯自訂樣式檔，先把瀏覽器完全關閉。
 +
# 到[[設定檔詳解|個人設定檔]]的 chrome 子路徑內，用文字編輯器打開 userContent.css（如果沒有此檔，把 userContent-example.css 檔重命名為 userContent.css）。
 +
# 置入樣式規則
  
−
以下內容取自 http://lists.w3.org/Archives/Public/www-style/2004Aug/0135.html
+
== <code>@-moz-document</code> 語法 ==
  
−
The syntax that I've implemented is the addition of an @-moz-document
+
指定網站的規則是 <code>@-moz-document</code>。語法為
−
rule that works like an @media rule and has the syntax (in some
 
−
reasonably typical notation):
 
  
−
docrule ::= "@-moz-document" S+ url-list "{" S* ruleset* "}"
+
  @-moz-document 位址指定表 {
−
 
+
    /* 樣式規則 */
−
url-list ::= url-item ( "," S* url-item )*
+
  }
−
 
 
−
url-item ::= ( "url(" | "url-prefix(" | "domain(" ) URL ")" S*
 
  
−
where S is from the CSS2 tokenization, ruleset is from the CSS2 grammar,
+
位址指定表是個以逗號 (,) 區格的列表，指定項可以是
−
and URL is like the production URI in the CSS2 tokenization except
+
* <code>url(<var>URL</var>)</code> : 指定完整位址為 <var>URL</var> 的網頁。注意 <var>URL</var> 前後不用引號 (")。
−
without the 'url(' and ')'.
+
* <code>url-prefix(<var>URL</var>)</code> : 指定位址以 <var>URL</var> 為開頭的網頁。
 +
* <code>domain(<var>URL</var>)</code> : 指定位址主機是 <var>URL</var> 或以 <var>URL</var> 為開頭的網頁。
  
−
To define the three functions by example:
+
=== 範例 ===
  
 
   @-moz-document url(http://www.w3.org/),
 
   @-moz-document url(http://www.w3.org/),
行 28： 行 27：
 
   {
 
   {
 
     /* 這裡的 CSS 規則會套用到
 
     /* 這裡的 CSS 規則會套用到
−
       + "http://www.w3.org/" 頁面
+
       - "http://www.w3.org/" 頁面
−
       + 任何位址以 "http://www.w3.org/Style/" 為開頭的頁面
+
       - 位址以 "http://www.w3.org/Style/" 為開頭的頁面
−
       + 任何位址主機是 "moztw.org" 或以 ".moztw.org" 為結尾的頁面
+
       - 位址主機是 "moztw.org" 或以 ".moztw.org" 為結尾的頁面
 
     */
 
     */
 
   }
 
   }
  
−
== 範例 ==
+
== 分檔指定網頁樣式 ==
 +
 
 +
為了樣式表管理方便，使用者可以將網頁樣式規則以各別 .css 檔存到 chrome 路徑內，再嵌入到 userContent.css 檔內。要嵌入外部 .css 檔，用以下語法：
 +
  @import(moztw.css) /* 嵌入 moztw.css 檔 */
 +
注意 <code>@import</code> 必須要放在其它所有樣式規則之前（<code>@-moz-document</code> 無此限制）。
 +
 
 +
== 參考資料 ==
 +
* [https://bugzilla.mozilla.org/show_bug.cgi?id=238099 Bug 238099 - implement at-rule for matching on site/document URL] (L. David Baron)
 +
* [http://lists.w3.org/Archives/Public/www-style/2004Aug/0135.html www-style - per-site user stylesheet rules] (L. David Baron)
 +
<!--
 +
http://lxr.mozilla.org/mozilla/source/layout/style/nsCSSParser.cpp#1182
 +
http://lxr.mozilla.org/mozilla/source/layout/style/nsCSSParser.cpp#1389
 +
-->
 +
 
 
[[Category:Firefox]]
 
[[Category:Firefox]]

於 2005年10月20日 (四) 08:48 的修訂

Mozilla Firefox 1.5 有新增了一個樣式表功能允許使用者為特定網站或網頁設立樣式，指定方式有網域名、完整位址、與位址前段三個。

編輯自訂樣式檔

  1. 要編輯自訂樣式檔，先把瀏覽器完全關閉。
  2. 到個人設定檔的 chrome 子路徑內，用文字編輯器打開 userContent.css（如果沒有此檔，把 userContent-example.css 檔重命名為 userContent.css）。
  3. 置入樣式規則

@-moz-document 語法

指定網站的規則是 @-moz-document。語法為 

 @-moz-document 位址指定表 {
   /* 樣式規則 */
 }

位址指定表是個以逗號 (,) 區格的列表，指定項可以是

  • url(URL) : 指定完整位址為 URL 的網頁。注意 URL 前後不用引號 (")。
  • url-prefix(URL) : 指定位址以 URL 為開頭的網頁。
  • domain(URL) : 指定位址主機是 URL 或以 URL 為開頭的網頁。

範例

 @-moz-document url(http://www.w3.org/),
                url-prefix(http://www.w3.org/Style/),
                domain(moztw.org)
 {
   /* 這裡的 CSS 規則會套用到
      - "http://www.w3.org/" 頁面
      - 位址以 "http://www.w3.org/Style/" 為開頭的頁面
      - 位址主機是 "moztw.org" 或以 ".moztw.org" 為結尾的頁面
    */
 }

分檔指定網頁樣式

為了樣式表管理方便，使用者可以將網頁樣式規則以各別 .css 檔存到 chrome 路徑內，再嵌入到 userContent.css 檔內。要嵌入外部 .css 檔，用以下語法： 

 @import(moztw.css) /* 嵌入 moztw.css 檔 */

注意 @import 必須要放在其它所有樣式規則之前（@-moz-document 無此限制）。

參考資料

取自 "https://wiki.moztw.org/index.php?title=針對特定網站設立樣式&oldid=9657"
個人工具