NB: Câu trả lời này không có bằng chứng chắc chắn, nó dựa trên quan sát của tôi trong suốt thời gian qua.
Các thuộc tính được tính toán màu xám không phải là mặc định, cũng không được kế thừa. Điều này chỉ xảy ra trên các thuộc tính không được xác định cho phần tử, nhưng được tính toán từ phần tử con hoặc phần tử gốc của nó dựa trên kết xuất bố cục thời gian chạy.
Lấy trang đơn giản này làm ví dụ, displaylà trang mặc định và font-sizeđược kế thừa:
<style>
div { font-size: 13px; }
</style>
<div>
<p>asdf</p>
</div>
Trong ví dụ cụ thể này, heightđược tính từ <p>nút văn bản con của (cỡ chữ cộng với chiều cao dòng), widthđược tính từ <div>chiều rộng của nút cha , cũng được tính từ nút cha của nó <body>.
CHỈNH SỬA: Tôi đã nghĩ lại, đây là câu trả lời dựa trên ý kiến của tôi . Tôi thực sự nên đi và xem qua mã nguồn Chromium sau: D
Bằng cách mở rộng các mũi tên đó, bạn có thể thấy quy tắc thực tế nào được áp dụng cho phần tử, trong số tất cả những quy tắc được xác định dựa trên nó (trực tiếp hoặc kế thừa, bởi nhà phát triển hoặc trình duyệt):
Tại đây, bạn có thể truy tìm mọi định nghĩa, thậm chí bao gồm các quy tắc tích hợp sẵn của trình duyệt và kiểm tra bằng cơ chế xếp tầng CSS (ghi đè).
Vì vậy, đối với những phần tử không có định nghĩa CSS (không được xác định trực tiếp, không được kế thừa, không được tích hợp sẵn trong trình duyệt), bạn không có bất kỳ nguồn nào để theo dõi. Và các giá trị thuộc tính hoàn toàn được tính toán thời gian chạy.
Nếu bạn chọn Hiển thị tất cả , nhiều thuộc tính màu xám hơn sẽ được hiển thị. Chúng cũng không được định nghĩa ở bất cứ đâu. Nhưng không giống như các ảnh chụp màn hình trước, chúng không được tính toán thời gian chạy - chúng là giá trị mặc định của thông số CSS.
