Per posting ini, CSS @scope tidak ada fallback support. Tapi kamu tetap bisa bikin alternatif.
html |
---|
[ .widget-Post [ .inner id="top" [ .title Post title ] ] [ .widget-Comment .sub-widget [ .inner id="bottom" First comment ] ] ] |
Pada HTML di atas, kalau kita mau memberi background kuning pada .inner#top saja, maka CSS @scope sebagai berikut:
css |
---|
.widget-Post { @scope (&) to (.sub-widget) { .inner { background: yellow; } } } |
Kalau tanpa CSS @scope, sebenarnya kita cukup beri nama class yang yang lebih spesifik saja, misalnya jadi .inner-Post dan .inner-Comment.
css |
---|
.widget-Post { .inner-Post { & { background: yellow; } } } |
Penamaan kapital Post di sini disengaja supaya lebih mudah dikenali saja.
Komentar
Posting Komentar