在过去的几年里,我经常使用 unset 关键字来重置 CSS 属性。我注意到我直观地使用它来重置属性。但对我来说直观的东西对你来说可能并不直观。让我澄清一下。
例如,我多年来一直使用 border: none 来删除元素的边框。这些天,我使用 border: unset,边框就消失了。
边框很简单,因为它们是非继承属性,这意味着子元素不会从其父元素继承值。
边距和填充也是如此,我经常需要重置它们。
但是继承的属性呢?在下面的示例中,最后一个按钮将具有蓝色。这是因为未设置属性本质上意味着继承继承的属性颜色,按钮就是这样做的并将颜色设置为蓝色。
这些事情对我来说很有意义,我是一位经验丰富、了解继承的 CSS 开发人员。但对于初学者来说,这些概念并不是微不足道的。我敢说大多数初学者甚至没有听说过继承和非继承属性,或者可能会忘记它们。他们可能会了解级联,这是不一样的。
最终的样式基于级联、特异性、继承等。 MDN 有一篇关于理解级联、特异性和继承的非常扎实的文章。
这里同样重要的是继承的概念,这意味着默认情况下某些 CSS 属性会继承当前元素的父元素上设置的值,而有些则不会。这也可能会导致一些您可能意想不到的行为。
—MDN
最后一句话看起来很可怕,不知道继承会带来什么。如果您记住哪个财产将从其父母那里继承价值,这可能会有所帮助,但这会随着时间的推移而发生。查找这些信息可能会很乏味——查看文档或在笔记中搜索。重要的是知道继承的存在以及它可能会导致问题,尤其是在使用 unset 关键字时。
我认为列出我经常取消设置的非继承属性可能会很有用,因此可以安全地取消设置:
当涉及到重置 CSS 属性时,unset 关键字会派上用场。但是,重要的是要考虑您正在使用的财产的继承。
如果你想确保最大的安全性,取消设置不继承的属性可能是你最好的选择。通过这样做,您可以消除任何潜在的风险,并放心地知道您的样式表是安全的。
以上是重置 CSS 未设置的详细内容。更多信息请关注PHP中文网其他相关文章!