Universal Selector * khớp với **bất kỳ element nào** trong document. Kết hợp với namespace có thể chọn element trong namespace cụ thể.
Cú pháp cơ bản
* {
color: #FFFF00; /* Màu vàng cho TẤT CẢ element */
}
Ứng dụng phổ biến
1. CSS Reset / Normalize (box-sizing)
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
2. Debug / Outline mọi element
* { outline: 1px solid red; }
3. Kế thừa (inheritance) ép buộc
* {
font-family: inherit;
color: inherit;
}
Kết hợp với namespace
/* Tất cả element trong namespace SVG */
svg|* { fill: currentColor; }
/* Tất cả element trong namespace HTML (mặc định) */
*|* { color: black; }
/* Tất cả element bất kể namespace */
|* { box-sizing: border-box; }
Hiệu năng & Lưu ý
- Universal selector **rất nhanh** (browser optimize tốt), không gây chậm như lời đồn đại cũ.
- Không lạm dụng cho style phức tạp (chỉ dùng reset, inherit, debug).
- Độ đặc hiệu:
(0, 0, 0)- thấp nhất, dễ bị ghi đè.