会崩溃发生的情况是,存在三层特异性。有 id,有类和属性,还有元素本身。在这三层中,我们完全控制其中一层。类和属性,我们可以用它们做任何我们想做的事情。它们是可重复使用的,并且是可定制的。其他两层都不是这样。一旦事情变得复杂,我们通常会尝试在单层中完成所有级联管理,然后生气,举手投足,并增加重要性。这并不理想。
米里亚姆:我正在研究起源,因为我打算制作一些视频来完整地教授级联,我认为这实际上非常聪明。作为作者,我们经常拥有来自不同地方并代表不同兴趣的风格。如果我们可以像对作者样式、用户样式和浏览器样式进行分层那样 电报号码数据 对它们进行分层,会怎样呢?但相反,如果它们是……这是设计系统,这是组件本身的样式,这是广泛的抽象。有时我们有目标狭窄的广泛抽象,有时我们有高度可重复的组件实用程序或需要很大重量的东西。如果我们可以明确地将它们放入命名层中怎么办?
米里亚姆:Jen Simmons 鼓励我将其提交给工作组,他们对此感到兴奋,并且规范进展得非常快。起初,我们都担心我们最终会陷入 z-index 的情况。999,000层左右。一旦我们开始整合语法,我们就发现这并不难避免。看到这一切的到来我真的很兴奋。我认为我们拥有一个很棒的语法。
德鲁:语法大致采用什么形式?我知道说出代码很困难,不是吗?
米里亚姆:这是一个称为“@layer”的“@”规则。实际上有两种方法。您还可以使用,我们在“@import”语法中添加了一个函数,以便您可以将样式表导入到层中,例如将 Bootstrap 导入到我的框架层中。但您也可以使用“@layer”规则创建或添加到图层。它只是“@layer”,然后是图层的名称。图层按照它们首次引入的顺序堆叠,这意味着即使您从各地引入样式表并且不知道它们将按什么顺序加载,您也可以在在您的文档中,说:“这是我计划加载的图层,这是我想要的顺序。” 然后,稍后,当您实际将样式添加到这些图层中时,它们会移至原始顺序。这也是一种说法,“忽略这里的源顺序。我希望能够以任何顺序加载我的样式,并且仍然控制它们如何相互覆盖。
德鲁:以它自己的方式,在顶部列出所有这些不同层的列表也是自我记录的,因为任何访问该样式表的人都可以看到所有层的顺序。
米里亚姆:这也意味着,比如说,Bootstrap 可以启动并使用大量内部层,并且您可以从 Bootstrap 中提取这些层。它们控制自己的图层如何相互关联,但您可以控制 Bootstrap 中的不同图层如何与您的文档关联。那么,什么时候 Bootstrap 应该胜过你的层,什么时候你的层应该胜过 Bootstrap?您可以开始非常明确地了解这些事情,而无需抛出“重要”标志。
德鲁:导入的样式表中的这些图层(如果有自己的图层)是否会在添加样式表时混合在一起?
米里亚姆:默认情况下,除非您之前在其他地方定义了如何对这些图层进行排序。因此,您的初始图层顺序仍将优先。 |