用[class=”xxx”]可匹配类名含指定子串的元素，如button[class=”btn-“]选中所有含”btn-“的按钮，但不区分单词边界；需全词匹配时应使用[class~=”xxx”]。
用 [class*="xxx"] 匹配类名包含关键词的元素
当元素类名不统一但有共同片段（比如 btn-primary、btn-danger、btn-small），直接写多个类选择器太啰嗦。用属性包含选择器更省事：
例如批量选中所有带 btn- 前缀的按钮：
button[class*="btn-"] { color: red; }
注意点：
-
[class*="btn-"]会匹配class="btn-primary disabled"，但也会误中class="my-btn-text"这类含子串的值 - 它不区分单词边界，比
[class^="btn-"]（开头匹配）宽松，比[class~="btn-primary"]（全词匹配）宽松 - 若类名顺序不确定或含空格，优先考虑
[class~="xxx"]配合已知完整类名
组合类名与属性选择器精准定位特定状态
常见场景：只对带某个类、同时具有某属性的元素生效，比如禁用态按钮需特殊样式：
立即学习“前端免费学习笔记（深入）”；
button.btn-primary[disabled] { opacity: 0.5; cursor: not-allowed; }
这种写法比单纯写 button[disabled] 更安全，避免影响其他类型禁用按钮。
关键细节：
