[CSS] 使用 attr() 將標籤上的屬性值帶入樣式的偽元素

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 變數帶入。