attr() 是 CSS 一個可以直接抓取標籤上的值的一個方法,比如說有一個 HTML 長這樣:
<div data-content="some content">
</div>
樣式寫這樣的話
div::after { content: attr(data-content); }
就會看到標籤內的偽元素內容會跟 data-content 裡的值一樣,在 CSS 可以用此方法抓任意的標籤的內容,不過目前是還只有偽元素的 content 可以用。
所以如果像這樣寫就是無效的
h2 { color: attr(data-color); }
如果有想要抓變動比較大的內容,目前還是建議用原生的 CSS 變數帶入。