CSS 功能參考資料

Kayce Basques
Jecelyn Yeen
Sofia Emelianova
Sofia Emelianova
GitHub

參閱這份詳盡的 Chrome 開發人員工具功能參考資料，瞭解新的工作流程： 查看及變更 CSS

如要瞭解基本概念，請參閱「查看及變更 CSS」。

選取元素

開發人員工具的「Elements」面板可讓您一次查看或變更一項元素的 CSS。

所選元素的範例。

在螢幕截圖中，已選取在「DOM 樹狀結構」中以藍色醒目顯示的 h1 元素。 在右側的「樣式」分頁中，顯示元素的樣式。左側的元素是 在檢視點上醒目顯示，但僅限於因為滑鼠遊標在 DOM 中 樹狀結構。

詳情請參閱「查看元素的 CSS」一文。

選取元素的方法有很多種：

  • 在可視區域中，在元素上按一下滑鼠右鍵，然後選取「檢查」。
  • 在開發人員工具中，按一下「選取元素」 選取元素 或按下 Command + Shift + C 鍵 (Mac) 或 Control + Shift + C (Windows 和 Linux)，然後點選 檢視區域
  • 在開發人員工具中，按一下「DOM 樹狀結構」中的元素。
  • 在開發人員工具中，前往主控台執行 document.querySelector('p') 這類查詢，然後在 ，然後選取「在元素面板中顯示」。

查看 CSS

使用「元素」>「樣式」和「運算」分頁可查看 CSS 規則及診斷 CSS 問題。

「樣式」分頁會在不同位置顯示前往其他位置的連結，包括但不限於：

  • 在「CSS 規則」旁邊，前往樣式表和 CSS 來源。這類連結會開啟「來源」面板。如果樣式表經過壓縮，請參閱將檔案設為可讀取的檔案。
  • 在「Inherited from ...」部分中移至父項元素。
  • 在 var() 呼叫中，對自訂屬性宣告。
  • 在 animation 簡寫屬性中設為 @keyframes。
  • 說明文件工具提示中的瞭解詳情連結。
  • 還能使用更多其他功能。

以下是其中幾個重點：

醒目顯示多個連結。

連結的樣式可能不同。如果您不確定某個項目是否為連結，請按一下該連結查看相關資訊。

查看包含 CSS 說明文件、詳細程度和自訂屬性值的工具提示

元素 >將滑鼠遊標懸停在特定元素上時，樣式會顯示有關實用資訊的工具提示。

查看 CSS 說明文件

如要查看含有 CSS 簡短說明的工具提示，請將滑鼠遊標懸停在「Styles」分頁中的屬性名稱上方。

含有 CSS 屬性說明文件的工具提示。

點按「瞭解詳情」，即可查看這項資源的 MDN CSS 參考資料。

如要關閉工具提示，請勾選 核取方塊。「不顯示」。

如要重新啟用，請依序前往 。「設定」>偏好設定 >元素 >核取方塊。 顯示 CSS 說明文件工具提示。

查看選取器明確性

將滑鼠遊標懸停在選取器上，即可查看工具提示，其中包含明確性權重。

這個工具提示指出相符選取器的特定程度權重。

查看自訂屬性值

將遊標懸停在 --custom-property 上，即可在工具提示中查看值。

工具提示中自訂屬性的值。

查看無效、已覆寫、已停用和其他 CSS

「樣式」分頁會辨識多種 CSS 問題，並以不同方式醒目顯示它們。

請參閱「樣式」分頁中的 CSS 簡介。

只查看實際套用至元素的 CSS

「樣式」分頁會顯示套用至元素的所有規則，包括 如果不想取得覆寫的宣告，請使用 Computed 分頁，即可只顯示實際套用至元素的 CSS。

  1. 選取元素。
  2. 前往「Elements」面板中的「Computed」分頁。

「運算」分頁。

勾選 [顯示全部] 核取方塊即可查看所有屬性。

請參閱「運算」分頁中瞭解 CSS 的簡介。

按字母順序查看 CSS 屬性

使用「Computed」分頁。詳情請參閱「只查看實際套用至元素的 CSS」。

查看沿用的 CSS 屬性

勾選「Computed」分頁中的「Show All」核取方塊。只查看實際運作的 CSS 套用至元素

或者，您也可以捲動「Styles」(樣式) 分頁標籤，找出名為 Inherited from <element_name> 的區段。

查看「Styles」分頁的「Inherited from...」部分。

查看 CSS 規則

規則是 CSS 陳述式，可讓您控制 CSS 行為。元素 >樣式會在專屬部分顯示下列守則：

查看規則的 @property 項規則

@property CSS at-rule 可讓您明確定義 CSS 自訂屬性，並在樣式表中註冊這些屬性，而不必執行任何 JavaScript。

將滑鼠遊標懸停在「樣式」分頁中的這類屬性的名稱上，即可在「樣式」分頁底部的可收合 @property 部分查看工具提示，其中包含屬性值、描述元及註冊的連結。

如要編輯 @property 規則，請按兩下其名稱或值。

查看規則的 @supports 項規則

「樣式」分頁會顯示 @supports CSS 規則 (如果這些規則已套用至元素)。舉例來說，請檢查下列元素：

查看 @support at-rules。

如果您的瀏覽器支援 lab() 函式，則元素為綠色，否則為紫色。

查看規則的 @scope 項規則

「樣式」分頁會顯示元素已套用的 CSS @scope 規則。

新的 @scope 規則是 CSS 階層結構與沿用第 6 級規格的一部分。這些規則可讓您設定 CSS 樣式範圍，也就是明確將樣式套用到特定元素。

在以下預覽畫面中查看 @scope 規則：

  1. 檢查預覽畫面中資訊卡上的文字。
  2. 在「Styles」分頁中，找到 @scope 規則。

@scope 規則。

在本例中，針對具有 card 類別的元素內所有 <p> 元素，@scope 規則會覆寫全域 CSS background-color 宣告。

如要編輯 @scope 規則，請按兩下該規則。

查看規則的 @font-palette-values 項規則

您可以利用 @font-palette-values CSS at-rule 來自訂 font-palette 屬性的預設值。元素 >樣式會在專屬的部分顯示這項規則。

查看下一個預覽畫面中的 @font-palette-values 部分：

  1. 在預覽畫面中檢查第二行文字。
  2. 在「樣式」中，找到 @font-palette-values 區段。

@font-palette-values 規則。

在這個範例中，--New 字型調色盤值會覆寫該顏色的預設字型。

如要編輯自訂值，請按兩下。

查看規則的 @position-try 項規則

@position-try CSS 規則和 position-try-options 屬性可讓您定義元素的替代錨定位置。詳情請參閱「隆重推出 CSS 錨定定位 API」一文。

元素 >樣式會解析並連結下列內容：

  • position-try-options 屬性值轉換為專屬的 @position-try --name 區段。
  • position-anchor 屬性值和 anchor() 引數，分別對應到含有 popovertarget 屬性的對應元素。

檢查下一個預覽畫面中的 position-try-options 值和 @position-try 區段：

搭配 popover 使用錨定標記示範
  1. 在預覽畫面中，開啟子選單，然後依序點選「您的帳戶」和「商店」。
  2. 在預覽畫面中使用 id="submenu" 檢查元素。
  3. 在「樣式」中，找出 position-try-options 屬性，然後按一下其 --bottom 值。「Styles」分頁會將您導向對應的 @position-try 區段。
  4. 按一下 position-anchor 值連結或相同的 anchor() 引數。「Elements」面板會選取含有對應 popovertarget 屬性的元素，「Styles」分頁則顯示元素的 CSS。

position-try-options 屬性、@position-try 區段，以及含有 popover 目標屬性的元素。

如要編輯值，請在所需值上按兩下。

查看元素的方塊模型

如要查看元素的方塊模型，請前往「樣式」分頁，然後按一下動作列中的「顯示側欄」顯示側欄。按鈕。

Box 模型圖

如要變更值，請在該值上按兩下。

搜尋及篩選元素的 CSS

使用「樣式」和「運算」分頁中的「篩選器」方塊，搜尋特定的 CSS 屬性或值

篩選「樣式」分頁。

如要一併搜尋「Computed」分頁中繼承的屬性，請勾選「Show All」核取方塊。

在「運算」分頁中篩選繼承的屬性。

如要前往「運算」分頁，勾選「群組」，即可將可收合類別中篩選的屬性分組。

將篩選後的屬性分組。

模擬已聚焦的網頁

如果您將焦點從頁面切換至開發人員工具，當焦點觸發某些重疊元素時，這些元素會自動隱藏。例如：下拉式選單、選單或日期挑選器。您可以使用 check_box「模擬聚焦網頁」選項來為這類元素偵錯，就像該元素位在焦點一樣。

請嘗試在這個示範頁面中模擬聚焦頁面：

  1. 將焦點移至輸入元素。該元素下方會顯示另一個元素。
  2. 開啟開發人員工具。「開發人員工具」視窗現已成為焦點，而非頁面，因此元素會再次消失。
  3. 在「元素」中 >樣式：按一下 :hov，並勾選 check_box 模擬聚焦頁面，並確認輸入的元素已選取。您現在可以查看該元素下的元素。

開啟「模擬已聚焦的網頁」前後如果有需要 SQL 指令的分析工作負載 則 BigQuery 可能是最佳選擇

您也可以在「轉譯」面板中找到相同選項。

切換虛擬類別

如要切換虛擬類別 (例如 :active、:focus、:focus-within、:target、:hover、:visited 或 focus-visible)，請按照下列步驟操作：

  1. 選取元素。
  2. 在「Elements」面板中，前往「Styles」分頁。
  3. 按一下「:hov」。
  4. 勾選要啟用的虛擬類別。

切換元素上的懸停虛擬狀態。

在可視區域中，您可以看到開發人員工具會將 background-color 宣告套用至元素 (即使元素實際上並未懸停)。

如需互動式教學課程，請參閱「為類別新增虛擬狀態」一文。

查看繼承的醒目顯示虛擬元素

虛擬元素可讓您設定元素特定部分的樣式。醒目顯示的虛擬元素是包含「選取」的文件部分且樣式會顯示為「醒目顯示」以便向使用者指出此狀態。舉例來說，這類虛擬元素為 ::selection、::spelling-error、::grammar-error 和 ::highlight。

如規格中所述，當多種樣式衝突時，串場會決定勝出樣式。

如要進一步瞭解規則的沿用機制和優先順序，請查看沿用的醒目顯示虛擬元素：

  1. 檢查下方文字。

    我沿用了家長醒目顯示虛擬元素的樣式。選擇我！

  2. 選取上方部分文字。

  3. 在「Styles」分頁中向下捲動，找出 Inherited from ::selection pseudo of... 部分。

查看「樣式」分頁的「沿用」部分。

查看串聯圖層

階層式圖層可更精確地控制 CSS 檔案，避免樣式專屬衝突。這適用於大型程式碼集、設計系統，以及在應用程式中管理第三方樣式時。

如要查看串聯圖層，請檢查下一個元素，然後開啟「元素」>「樣式」。

在「Styles」分頁中，查看這 3 個階層圖圖層及其樣式：page、component 和 base。

串聯圖層。

如要查看圖層順序，請按一下圖層名稱或 切換圖層。「Toggle CSSLayer view」(切換 CSS 圖層檢視) 按鈕。

page 圖層的明確性最高，因此元素的背景呈現綠色。

如何使用列印模式檢視頁面：

  1. 開啟「指令選單」。
  2. 輸入 Rendering 並選取「Show Rendering」。
  3. 在「Emulate CSS Media」下拉式選單中，選取「print」。

透過「涵蓋範圍」分頁查看已使用和未使用的 CSS

「涵蓋範圍」分頁會顯示網頁實際使用的 CSS。

  1. 按下 Command + Shift + P 鍵 (Mac) 或 Control + Shift + P 鍵 (Windows、Linux、ChromeOS)，開發人員工具為 即可開啟指令選單

  2. 開始輸入 coverage。

    正在透過指令選單開啟「涵蓋範圍」分頁。

  3. 選取「顯示涵蓋範圍」。畫面上會顯示「涵蓋範圍」分頁。

    「涵蓋範圍」分頁。

  4. 按一下「Reload」圖示 開始檢測覆蓋範圍並重新載入頁面。。 系統會重新載入頁面，「涵蓋範圍」分頁則概略說明 CSS (和 JavaScript) 的數量 所使用的檔案

    概略說明使用和未使用的 CSS (和 JavaScript) 數量。

    綠色代表已使用的 CSS。紅色代表未使用的 CSS。

  5. 點選任一 CSS 檔案，即可在上方預覽中逐行查看 CSS 所用 CSS 的逐行細目。

    已使用和未使用 CSS 的逐行細目。

    在螢幕截圖中，系統不會使用 devsite-google-blue.css 的第 55 到 57 行和 65 至 67 行，而使用第 59 到 63 行。

強制列印預覽模式

請參閱「強制開發人員工具切換至列印預覽模式」。

複製 CSS

透過「樣式」分頁的單一下拉式選單中，您可以複製個別的 CSS 規則、宣告、屬性、值

此外，您可以使用 JavaScript 語法複製 CSS 屬性。如果使用 CSS-in-JS 程式庫，這個選項就很實用。

如何複製 CSS：

  1. 選取元素。
  2. 在「元素」中 >「Styles」(樣式) 分頁標籤，在 CSS 屬性上按一下滑鼠右鍵。 複製 CSS 下拉式選單。

  3. 從下拉式選單中選取下列其中一個選項：

    • 複製聲明。以 CSS 語法複製屬性及其值： css property: value;
    • 複製資源。僅複製 property 名稱。
    • 複製值。僅複製 value。
    • 複製規則。複製整個 CSS 規則： css selector[, selector] { property: value; property: value; ... }
    • 以 JS 格式複製宣告內容。以 JavaScript 語法複製屬性及其值： js propertyInCamelCase: 'value'
    • 複製所有宣告。複製 CSS 規則中的所有屬性及其值： css property: value; property: value; ...

    • 以 JS 格式複製所有宣告內容。以 JavaScript 語法複製所有屬性及其值： ```js propertyInCamelCase: 'value', propertyInCamelCase: 'value', ...

    • 複製所有 CSS 變更內容。在所有聲明中複製您在「樣式」分頁中所做的變更。

    • 查看運算值。前往「Computed」分頁。

變更 CSS

本節列出您可以在「元素」> 中變更 CSS 的所有方法。樣式：

此外，您還可以：

將 CSS 宣告新增至元素

由於宣告順序會影響元素的樣式，因此您可在 方法如下：

應採用哪種工作流程？在大多數情況下，您可能會想要使用 宣告工作流程內嵌宣告的具體性高於外部宣告，因此內嵌宣告 可確保變更在元素中生效。請參閱選取器程式碼 類型，盡量具體說明。

如要對元素的樣式進行偵錯，且需要特別測試 宣告在不同位置定義，請使用其他工作流程。

新增內嵌宣告

如何新增內嵌宣告：

  1. 選取元素。
  2. 在「Styles」分頁中，按一下 element.style 區段的方括號間。遊標 讓您輸入文字
  3. 輸入屬性名稱，然後按下 Enter 鍵。

  4. 輸入該屬性的有效值，然後按下 Enter 鍵。在 DOM 樹狀結構中，你可以 您會發現元素中新增了 style 屬性。

    新增內嵌宣告。

    在螢幕截圖中，margin-top 和 background-color 屬性已套用至所選元素。在「DOM 樹狀結構」中，可以看到元素的 style 屬性顯示了宣告內容。

在樣式規則中新增宣告

如何在現有的樣式規則中新增宣告：

  1. 選取元素。
  2. 在「樣式」分頁中，找出您要新增的樣式規則，然後點選相應的括號 宣告內容滑鼠遊標將焦點放在可輸入文字。
  3. 輸入屬性名稱，然後按下 Enter 鍵。
  4. 輸入該屬性的有效值，然後按下 Enter 鍵。

變更宣告的值。

在螢幕截圖中，樣式規則會取得新的 border-bottom-style:groove 宣告。

變更宣告名稱或值

按兩下宣告的名稱或值，即可變更。請參閱變更列舉值， 鍵盤快速鍵，可讓您快速將值遞增或縮減 0.1、1、 10 或 100 個單位。

使用鍵盤快速鍵變更列舉值

編輯宣告的列舉值 (例如 font-size) 時，您可以使用下列鍵盤快速鍵，將值增加為固定金額：

  • Option + 向上鍵 (Mac) 或 Alt + 向上鍵 (Windows、Linux) 即可 值以 0.1 為單位遞增。
  • 向上：將值變更為 1；如果目前值介於 -1 和 1 之間，則調整為 0.1。
  • Shift + 向上鍵可增加 10 度。
  • Shift + Command + Up 鍵 (Mac) 或 Control + Shift + Page Up 鍵 (在 Windows 和 Linux) 中增加 100 的值。

也可以使用減量功能。只要將前述的 Up 例項替換成 向下。

變更長度值

您可以使用指標變更任何長度的屬性，例如寬度、高度、邊框間距、邊界或框線。

如何變更長度單位：

  1. 將滑鼠遊標懸停在單元名稱上，您會發現該名稱在底線下。

  2. 按一下單元名稱，從下拉式選單中選取單元。

如何變更長度值：

  1. 將滑鼠遊標懸停在單位值上，您會發現指標變成水平雙頭箭頭。

  2. 水平拖曳即可增加或減少值。

如要以 10 為單位調整值，請在拖曳時按住 Shift 鍵。

新增元素類別

如何為元素新增類別：

  1. 在 DOM 樹狀結構中選取元素。
  2. 按一下「.cls」.cls。
  3. 在「Add New Class」方塊中輸入課程名稱。
  4. 按下 Enter 鍵。

元素類別區段。

模擬淺色和深色主題的偏好設定，並啟用自動深色模式

如何切換自動深色模式或模擬使用者偏好的淺色或深色主題：

  1. 在「元素」頁面中 >「樣式」分頁標籤，點選 切換常用轉譯模擬功能。「切換常見的顯示模擬選項」。 切換常用轉譯模擬功能。

  2. 從下拉式清單中選取下列其中一個選項：

    • prefers-color-scheme: Light。表示使用者偏好淺色主題。
    • prefers-color-scheme：dark。表示使用者偏好深色主題。
    • 自動深色模式。即使你並未實作網頁，系統仍會以深色模式顯示網頁。此外，系統會自動將 prefers-color-scheme 設為 dark。

這個下拉式選單是「模擬 CSS 媒體功能」prefers-color-scheme 和「算繪」分頁中「啟用自動深色模式」選項的捷徑。

切換課程

如何啟用或停用元素的類別：

  1. 在 DOM 樹狀結構中選取元素。
  2. 開啟「Element Classes」部分。請參閱為元素新增類別。在 [Add New (新增)] 下方， 類別方塊是指目前套用至此元素的所有類別。
  3. 找出要啟用或停用的課程，然後勾選旁邊的核取方塊。

新增樣式規則

如何新增樣式規則：

  1. 選取元素。
  2. 按一下「新增樣式規則」 新增樣式規則。。開發人員工具會插入 在 element.style 規則下方新增規則

新增樣式規則。

在螢幕截圖中，開發人員工具會在按一下「New Style Rule」(新增樣式規則) 後新增 h1.devsite-page-title 樣式規則。

選擇要新增規則的樣式表

新增樣式規則時，點選並按住「新增樣式規則」 按 新增樣式規則。 即可選擇樣式工作表 新增樣式規則

選擇樣式表。

切換宣告

如何開啟或關閉單一聲明：

  1. 選取元素。
  2. 在「樣式」分頁中，將滑鼠遊標懸停在定義宣告的規則上。下一節顯示核取方塊 每個宣告項目
  3. 勾選或取消勾選聲明旁邊的核取方塊。清除聲明時，開發人員工具 表示已經不再有效

切換宣告。

在螢幕截圖中，目前所選元素的 color 屬性為關閉狀態。

在動畫播放期間編輯 ::view-transition 虛擬元素

請參閱動畫中對應的章節。

詳情請參閱「透過 View Transitions API 順暢轉換」。

使用格線編輯器對齊格線項目和其內容

請參閱檢查 CSS 格線中對應的部分。

使用顏色挑選器變更顏色

請參閱使用顏色挑選器檢查 HD 高畫質和非 HD 高畫質色彩，並進行偵錯。

使用角度時鐘變更角度值

「角度時鐘」提供的 GUI 可用於變更 CSS 屬性值中的 <angle>。

如何開啟「角度時鐘」：

  1. 選取包含角度宣告的元素。

  2. 在「樣式」分頁中，找到要變更的 transform 或 background 宣告。 按一下角度值旁邊的「角度預覽」方塊。

    角度預覽。

    -5deg 和 0.25turn 左側的小時鐘是角度預覽畫面。

  3. 按一下預覽畫面，開啟「角度時鐘」。

    角度時鐘。

  4. 按一下「角度時鐘」圓圈或捲動滑鼠，即可調整角度值 將角度值調高 / 調低 1。

  5. 可使用其他鍵盤快速鍵變更角度值。詳情請參閱「樣式」窗格 鍵盤快速鍵。

使用陰影編輯器變更方塊和文字陰影

Shadow 編輯器提供 GUI，可用於變更 text-shadow 和 box-shadow CSS 宣告。

如何使用「陰影編輯器」變更陰影：

  1. 選取包含陰影宣告的元素。例如選取下一個元素。

  2. 在「Styles」分頁中，找到 text-shadow 或 box-shadow 宣告旁邊的陰影 陰影。 圖示。

    陰影圖示。

  3. 按一下陰影圖示，開啟「陰影編輯器」。

    陰影編輯器。

  4. 變更陰影屬性：

    • 類型 (僅適用於 box-shadow)。選擇「Outset」或「Inset」。
    • X 和 Y 軸位移。拖曳藍點或指定值。
    • 模糊處理。拖曳滑桿或指定值。
    • Spread (僅適用於 box-shadow)。拖曳滑桿或指定值。

  5. 觀察已套用至元素的變更。

使用 Easing 編輯器編輯動畫和轉場時間

Easing 編輯器提供 GUI，可用於變更 transition-timing-function 和 animation-timing-function 的值。

如何開啟「Easing 編輯器」：

  1. 選取包含時間函式宣告的元素，例如本頁中的 <body> 元素。
  2. 在「Styles」分頁中，找到 transition-timing-function、animation-timing-function 宣告或 transition 簡短屬性旁邊的紫色 輕鬆、 圖示。 「Easing 編輯器」圖示。
  3. 按一下圖示，開啟「Easing Editor」： Easing 編輯器。

使用預設設定調整時間

如要按一下即可調整時間，請使用「Easing Editor」中的預設設定：

  1. 如要在「Easing Editor」中設定關鍵字值，請點選其中一個挑選器按鈕：
    • 線性 線性按鈕。
    • 緩和 「緩入」按鈕。
    • 加減式按鈕。減少期間
    • 減速 緩和設計按鈕。

  2. 在「預設切換器」中，按一下 左側。 或 好 按鈕，選擇下列其中一個預設選項：

    • 線性預設：elastic、bounce 或 emphasized。
    • Cubic Bezier 預設：
時間安排關鍵字 預設 三次方貝茲
先加速後減速 內在外 cubic-bezier(0.45, 0.05, 0.55, 0.95)
半外面，二戰 cubic-bezier(0.46, 0.03, 0.52, 0.96)
便當外語 cubic-bezier(0.65, 0.05, 0.36, 1)
快速通風，慢速 cubic-bezier(0.4, 0, 0.2, 1)
外出、返回 cubic-bezier(0.68, -0.55, 0.27, 1.55)
加速 In、Sine cubic-bezier(0.47, 0, 0.75, 0.72)
內、二次 cubic-bezier(0.55, 0.09, 0.68, 0.53)
印度、古比文 cubic-bezier(0.55, 0.06, 0.68, 0.19)
入鏡 cubic-bezier(0.6, -0.28, 0.74, 0.05)
快閃，線性轉入 cubic-bezier(0.4, 0, 1, 1)
減速 外出、正弦 cubic-bezier(0.39, 0.58, 0.57, 1)
外、二次 cubic-bezier(0.25, 0.46, 0.45, 0.94)
離開、古比文 cubic-bezier(0.22, 0.61, 0.36, 1)
線性結束，慢速 cubic-bezier(0, 0, 0.2, 1)
離開、返回 cubic-bezier(0.18, 0.89, 0.32, 1.28)

設定自訂時間

如要設定時間函式的自訂值，請使用線條上的控制點：

  • 如果是線性函數，按一下線條上任一處即可新增控制點，然後拖曳。按兩下即可移除點。

    拖曳線性函數的控制點。

  • 如要使用 Cubic Bezier 函式，請拖曳其中一個控制點。

    拖曳立方貝茲函式的控制點。

任何變更都會觸發編輯器頂端「Preview」中的球形動畫。

(實驗功能) 複製 CSS 變更

啟用這項實驗後，「樣式」分頁會以綠色醒目顯示 CSS 變更。

如要複製單一 CSS 宣告變更，請將滑鼠遊標懸停在醒目顯示的宣告上，然後按一下 。「複製」按鈕。

複製 CSS 宣告變更。

如要一次複製所有宣告的 CSS 變更，請在任一聲明上按一下滑鼠右鍵，然後選取「複製所有 CSS 變更」。

複製所有 CSS 變更內容。

此外，您也可以透過「變更」分頁追蹤變更。