Tạo kiểu cho phần tử gốc (root) của tài liệu với CSS

Bộ chọn :root

:root chọn phần tử gốc của tài liệu: trong HTML là <html>. Độ đặc hiệu (specificity) cao hơn html (class level). Thường dùng để khai báo **CSS Custom Properties (biến CSS)**.

Ví dụ minh họa

<!DOCTYPE html>
<html>
<head>
  <style>
    :root {
      background: blue;
      color: white;
      /* Thường dùng để khai báo biến: */
      /* --main-color: #3498db; */
      /* --spacing: 1rem; */
    }
  </style>
</head>
<body>
  <h1>Tiêu đề</h1>
  <p>Văn bản demo. Nền xanh, chữ trắng áp dụng cho toàn trang.</p>
</body>
</html>

Toàn bộ trang (phần tử html) có nền xanh, chữ trắng. Ưu tiên dùng :root để định nghĩa biến CSS toàn cục.