多个类同时生效需在HTML中用空格分隔，CSS中用连续点号连接类名构成复合类选择器；如<div class="btn primary large">对应.btn.primary.large{}，顺序无关，空格或逗号会改变语义。
多个类同时生效，直接在HTML元素的class属性中用空格隔开即可，对应CSS里用不带空格的点号连续写——这就是复合类选择器（也叫多类选择器）。
HTML中怎么写多个类
一个元素可以拥有多个类名，只要用空格分开：
<div class="btn primary large">确定</div>这样btn、primary、large三个类就同时作用于这个<div>了。
CSS中怎么选中“同时拥有多个类”的元素
用连续的类选择器（中间不能有空格），表示“必须同时具备这几个类”：
立即学习“前端免费学习笔记（深入）”；
.btn.primary.large {background-color: #007bff;
padding: 12px 24px;
font-size: 16px;
}
这条规则只对同时含有btn、primary和large三个类的元素生效。顺序无关紧要，.primary.btn.large效果一样。
常见误区提醒
- 带空格是后代选择器：`.btn .primary` 表示“在 class 为 btn 的元素内部，找 class 为 primary 的子孙元素”，不是同一个元素。
- 类名之间不能有逗号：`.btn, .primary` 是“或”关系，匹配任意一个类，不是“同时拥有”。
- 不用加标签名也能精准定位：`.btn.primary` 比 `button.btn.primary` 更灵活，推荐优先用纯类组合。
