CSS marker 屬性

定義和用法

marker 屬性指向一個標記，該標記將繪制在元素路徑的所有頂點上（即第一個、中間和最后一個頂點）。

標記的形狀由 SVG <marker> 元素定義，并通過 url() 值進行引用。

CSS marker 屬性的值會覆蓋 SVG 中 marker 屬性的任何值。

實例

例子 1

指向一個標記（箭頭），該標記將繪制在元素路徑的第一個、中間和最后一個頂點上：

#test {
  marker: url(#arrow);
}

親自試一試

例子 2

指向一個標記（圓圈），該標記將繪制在元素路徑的第一個、中間和最后一個頂點上：

#test {
  marker: url(#circle);
}

親自試一試

CSS 語法

marker: none|url|initial|inherit;

屬性值

值 描述
none 默認值。在路徑上不會繪制任何標記。
url 對由 SVG <marker> 元素定義的標記的 URL 引用。
initial 將此屬性設置為其默認值。參閱 initial。
inherit 從其父元素繼承此屬性。參閱 inherit。

瀏覽器支持

表格中的數字表示首個完全支持該屬性的瀏覽器版本。

Chrome Edge Firefox Safari Opera
80 80 72 13.1 67

相關頁面

教程：SVG 標記

參考：CSS marker-start 屬性

參考：CSS marker-mid 屬性

參考：CSS marker-end 屬性