Bạn đã bao giờ áp dụng CSS cho một phần tử nhưng CSS không hoạt động chưa?
Với Công cụ của Chrome cho nhà phát triển, bạn có thể phát hiện nhanh các vấn đề về CSS, gỡ lỗi và kiểm tra các vấn đề đó.
Xem video để tìm hiểu cách ngăn Phần tử > Kiểu làm nổi bật các vấn đề về CSS:
Thuộc tính có cú pháp không hợp lệThuộc tính bị ghi đèTài sản không hoạt động
Kế thừa từ
parent
- tài sản kế thừa
- Tài sản không kế thừa
Thuộc tính viết tắt có thể mở rộng
-
Thuộc tính dài bị ghi đè - Thuộc tính dài tay đang hoạt động
-
biểu định kiểu tác nhân người dùng
- Tài sản không chỉnh sửa được
Thuộc tính không thể chỉnh sửa bị ghi đè
Các mẹo gỡ lỗi khác:
- Sử dụng bộ lọc trong ngăn Styles (Kiểu) để tập trung vào một thuộc tính mà bạn quan tâm.
- Sử dụng ngăn Computed (Tính toán) để xem tất cả những người chiến thắng Cascade và các giá trị được tính toán của chúng.
- Trong ngăn Computed (Tính toán), hãy mở rộng một thuộc tính rồi nhấp vào một đường liên kết để tìm nguồn của thuộc tính đó trong ngăn Styles (Kiểu).
Để tìm hiểu thêm về tất cả các cách Công cụ cho nhà phát triển làm nổi bật các vấn đề về CSS, hãy xem bài viết Tìm CSS không hợp lệ, bị ghi đè, không hoạt động và các CSS khác.
Để nâng cao kiến thức chuyên môn về CSS, hãy xem bài viết Tìm hiểu về CSS.
Để tìm hiểu cách tạo những trang web có giao diện đẹp mắt và phù hợp với mọi người, hãy xem bài viết Tìm hiểu về thiết kế thích ứng.