Cách sử dụng biến CSS - ty le keo ma cao

Trong khi xem qua thư viện UI dành cho ứng dụng mini ColorUI, tôi đã bắt gặp đoạn mã sau:

.bg-gradual-red {
  background-image: var(--gradualRed);
  color: var(--white);
}

Sau khi tìm hiểu cách sử dụng hàm var trong CSS, tôi mới nhận ra rằng từ phiên bản CSS3 trở đi, chúng ta đã có thể sử dụng biến CSS mà không cần phải dựa vào các công cụ như SASS hoặc LESS. Điều này thật sự rất tuyệt vời!

Cách sử dụng biến CSS

Những điểm chính cần lưu ý:

• Tên biến phải bắt nhà cái uy tín bk8vie đầu bằng hai dấu gạch ngang (--).
• Biến cần được định nghĩa bên trong một selector CSS để giới hạn phạm vi sử dụng của nó. Nếu muốn sử dụng toàn cầu, bạn có thể định nghĩa biến bên trong :root hoặc body trên trang web; trong trường hợp của ứng dụng mini, hãy dùng Page.
• Khi sử dụng biến, cú pháp là var(TênBiến, GiáTrịMặcĐịnh). Trường "GiáTrịMặcĐịnh" không bắt buộc nhưng kèo bóng đá có ích trong việc xử lý khi giá trị của biến không hợp lệ.

Những yếu tố nào phù hợp để định nghĩa thành biến CSS?

Các yếu tố thường xuyên được sử dụng và tái sử dụng có thể được chuyển thành biến CSS, chẳng hạn như:

• Các kích thước font chữ phổ biến.
• Các màu sắc chủ đạo của giao diện.

Liệu biến CSS có thể bị ghi đè không?

Câu trả lời là có! Giống như cách hoạt động của các thuộc tính CSS thông thường, nếu có nhiều định nghĩa khác nhau cho cùng một biến, selector có trọng số cao hơn sẽ ưu tiên áp dụng thay thế cho selector có trọng số thấp hơn.