class

Baseline 已廣泛支援

此特性已相當成熟，可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來，各瀏覽器均已提供此特性。

為元素分配類名或一組類名。您可以將相同的類名或類名分配給任意數量的元素，但是，多個類名必須用空格字元分隔。

元素的類名起著兩個關鍵作用：

作為樣式表選擇器，當作者為一組元素分配樣式資訊時。
供瀏覽器通用使用。

您可以使用此 class 來使用 CSS 為 SVG 內容設定樣式。

使用語境

分類	None
值	<class-names-list>
可動畫的	是

示例

html

<html lang="en">
  <body>
    <svg
      width="120"
      height="220"
      viewPort="0 0 120 120"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg">
      <style>
        <![CDATA[
          rect.rectClass {
            stroke: #000066;
            fill: #00cc00;
          }
          circle.circleClass {
            stroke: #006600;
            fill: #cc0000;
          }
        ]]>
      </style>

      <rect class="rectClass" x="10" y="10" width="100" height="100" />
      <circle class="circleClass" cx="40" cy="50" r="26" />
    </svg>
  </body>
</html>

元素

以下元素可以使用 class 屬性：

規範

規範
Scalable Vector Graphics (SVG) 2 # ElementSpecificStyling

瀏覽器相容性

幫助改進 MDN

瞭解如何貢獻

此頁面最後修改於 2025年6月7日，由 MDN 貢獻者進行編輯。

在 GitHub 上檢視此頁面 • 報告此內容的某個問題