cssのcontentについて調べてるうちに、attrという面白い機能を発見した。
attr()はcontentプロパティの値として使えるようで、たとえば、
<a href="test.html">テストページ</a>
というHTMLがあって、CSSを
a:after{
content: attr(href);
}
このように書くと、ブラウザでの表示は
テストページtest.html
となる。
htmlタグの属性値をcontentに組み込めるようだ。
以下のように文字列と組み合わせると
a:after{
content: "(link to : " attr(href) ")";
}
ブラウザでは
テストページ(link to : test.html)
となる。
これ使うやつ絶対変態だ・・・。
