我試圖通過類將 ul 和 li 重置為其默認(rèn)行為，但我遇到了麻煩。我嘗試過使用inheritandinitial但這不起作用。這是我到目前為止所擁有的：ul, li { margin: 0; padding: 0;}因此，我希望在這種情況下有一個(gè)名為 的類.list-unset，它將把子 DOM 設(shè)置為瀏覽器默認(rèn)值，而不是采用margin: 0和padding: 0。我努力了：.list-unset { ul, li { margin: unset; padding: unset; }}但這沒有用。
1 回答
Qyouu
TA貢獻(xiàn)1786條經(jīng)驗(yàn) 獲得超11個(gè)贊
重置元素的“正確”方法<ul>是inherit：
ul, li {
? margin: 0;
? padding: 0;
}
ul.unset, ul.unset > li {
? margin: inherit;
? padding: inherit;
}
<ul>
? <li>One</li>
? <li>Two</li>
? <li>Three</li>
</ul>
<ul class="unset">
? <li>One</li>
? <li>Two</li>
? <li>Three</li>
</ul>
但是，請記住該值是從其父元素繼承的。無論應(yīng)用于父級的規(guī)則（如果有）都將應(yīng)用于目標(biāo)。如果沒有設(shè)置規(guī)則，它將設(shè)置為默認(rèn)值，如上所述。
如果失敗，您可以手動(dòng)將默認(rèn)<ul>樣式應(yīng)用于目標(biāo)元素，確保應(yīng)用更高的特異性：
ul, li {
? margin: 0;
? padding: 0;
}
ul.unset {
? margin-left: 16px;
? margin-top: 1em;
? margin-bottom: 1em;
}
ul.unset > li {
? margin: 1px 0;
}
<ul>
? <li>One</li>
? <li>Two</li>
? <li>Three</li>
</ul>
<ul class="unset">
? <li>One</li>
? <li>Two</li>
? <li>Three</li>
</ul>
- 1 回答
- 0 關(guān)注
- 125 瀏覽
添加回答
舉報(bào)
0/150
提交
取消