Tôi đã xem câu hỏi yêu cầu the difference between height: 100%; and height: auto;, nhưng sự khác biệt giữa height: 100%; và height: inherit; là gì?Chiều cao CSS: 100% so với chiều cao: kế thừa
Tôi về cơ bản muốn chiều cao của phần tử này lấp đầy/khớp với vùng chứa của nó. Có lý do nào để sử dụng 100% trên inherit hoặc ngược lại không?
height: 100% sẽ khớp với chiều cao của cha mẹ của phần tử, bất kể giá trị độ cao của cha mẹ.
height: inherit sẽ, như tên của nó, kế thừa giá trị từ gốc của nó. Nếu giá trị của cha mẹ là height: 50% thì con cũng sẽ cao hơn 50% chiều cao của cha mẹ. Nếu kích thước của cha mẹ được xác định bằng các giá trị tuyệt đối (ví dụ: height: 50px), thì height: inherit và height: 100% sẽ có hành vi tương tự đối với trẻ.
Được giải thích rõ ràng. [Ví dụ ở đây] (http://jsbin.com/bepoqa/2/edit). –
@HashemQolami Ví dụ tuyệt vời! Tôi sẽ đề nghị thêm một lề cho div con để trực quan cho thấy rằng nó được chứa trong phụ huynh. – Nepoxx
Ah, đây là chìa khóa. Tôi không nghĩ về phần trăm. Nếu container có một phần trăm của bất cứ điều gì khác hơn 100%, yếu tố này chắc chắn sẽ không làm những gì tôi muốn nó làm. Tôi sẽ chấp nhận ngay khi nó cho phép tôi. – dnc253
height: kế thừa: Từ khóa kế thừa quy định rằng một tài sản nên kế thừa giá trị của nó từ yếu tố mẹ của nó.
height: 100%: Xác định chiều cao tính bằng phần trăm khối chứa
Đối với các ví dụ, look here
Bạn đã đọc những gì thừa kế không? Nếu vùng chứa không có chiều cao được chỉ định có nghĩa là nó sẽ được tự động, thì bạn sẽ kế thừa tự động. Ví dụ http://jsfiddle.net/50oaax77/ – Huangism
https://developer.mozilla.org/en-US/docs/Web/CSS/inherit – j08691
@ j08691 - Lưu ý rằng đối với mức độ liên quan của câu hỏi này, tài liệu MDN đó có một sai lầm quan trọng trong đoạn đầu tiên của nó. Phần tử thừa kế * giá trị được chỉ định * từ cha mẹ của nó, không phải giá trị được tính toán của nó. Xem http://www.w3.org/TR/CSS2/cascade.html#value-def-inherit – Alohci