calc()
calc関数はカッコ内の値を計算することができる関数。
1 2 3 4 |
.box { width: calc(100% - 60px); margin-left: 40px; } |
counter()
counter関数は要素を数えることができる。
1 2 3 4 5 6 7 |
body { counter-reset: i; } li:before { counter-increment: i; content: “手順” counter(i) “:”; } |
attr()
attr関数は、要素内の値を展開するための関数。
「data-」で始まるカスタム属性が使用できる。
1 2 3 |
li::before { content: attr(data-label); } |