仅名称的@container查询：命名战争的解决方案
💡
原文英文，约800词，阅读约需3分钟。
📝
内容提要
Safari 26.4引入了仅名称的@container查询，简化了CSS样式的命名和作用域管理。开发者可以在不增加特异性的情况下，使用名称过滤样式，从而避免复杂的类名和外部工具。这种方法提升了样式管理的便捷性和代码的可读性。
🎯
关键要点
-
Safari 26.4引入了仅名称的@container查询，简化了CSS样式的命名和作用域管理。
-
名称过滤样式可以避免复杂的类名和外部工具，提升样式管理的便捷性。
-
传统的@container查询需要声明大小条件，而名称查询只需使用名称，无需担心大小。
-
名称查询可以作为过滤器使用，不会增加特异性，便于样式的覆盖和管理。
-
目前该功能仅在Safari 26.4中可用，期待未来更多浏览器的支持。
❓
延伸问答
什么是仅名称的@container查询？
仅名称的@container查询是一种CSS功能，允许开发者通过名称过滤样式，而无需声明大小条件，从而简化样式管理。
仅名称的@container查询如何改善CSS样式管理？
它通过避免复杂的类名和外部工具，提升了样式管理的便捷性和代码的可读性。
传统的@container查询与仅名称的@container查询有什么区别？
传统的@container查询需要声明大小条件，而仅名称的@container查询只需使用名称，无需担心大小。
如何使用仅名称的@container查询？
首先注册容器，然后在匹配的@container块内包装每个组件的样式。
目前哪些浏览器支持仅名称的@container查询？
目前该功能仅在Safari 26.4中可用，期待未来更多浏览器的支持。
使用仅名称的@container查询有什么潜在的好处？
它可以减少样式冲突，避免特异性战争，使样式覆盖和管理更加简单。
🏷️
标签
➡️
