用更少的行减少CSS选择器

d4so4syb  于 2022-12-24  发布在  其他
关注(0)|答案(3)|浏览(155)

有没有可能减少这些CSS类?

body.bank #page_content input,
body.bank #page_content textarea,
body.bank #page_content .inp-checkbox,
.list-tr.bank input,
.list-tr.bank textarea,
.list-tr.bank .inp-checkbox,
body.creditor #page_content input,
body.creditor #page_content textarea,
body.creditor #page_content .inp-checkbox,
.list-tr.creditor input,
.list-tr.creditor textarea,
.list-tr.creditor .inp-checkbox,
body.debtor #page_content input,
body.debtor #page_content textarea,
body.debtor #page_content .inp-checkbox,
.list-tr.debtor input,
.list-tr.debtor textarea,
.list-tr.debtor .inp-checkbox{
    --opacity-border:35%;
}
gcuhipw9

gcuhipw91#

使用:where:is伪类。

:where(.list-tr.bank, .list-tr.creditor, .list-tr.debtor) :where(input, textarea, .inp-checkbox),
:where(body.bank, body.creditor, body.debtor) #page_content :where(input, textarea, .inp-checkbox) {
    --opacity-border: 35%;
}
sd2nnvve

sd2nnvve2#

body.bank而言,为什么不简单地使用.bank类呢?.list-tr也是如此。而且看起来#page_content可以用HTML main元素替换。

相关问题