這個問題在這里已經有了答案: 在 CSS 中,min-height 在所有瀏覽器中總是優先于 max-height 嗎? (1 個回答) 為什么設定 max-width 會使使用更具體的選擇器設定寬度無效? (2 個回答) 1 小時前關閉。
最大寬度覆寫寬度,但最小寬度覆寫最大寬度。-MDN
參考來自 MDN 檔案,但它們的真正含義是什么?如果我在下面的示例中以不同的順序放置寬度、最大寬度和最小寬度,我看不出有任何區別,例如首先是最小寬度。
div {
background: silver;
/* 500 px if the width of the parent element is ≥ 1000 px,
300 px if the width of the parent element is ≤ 600 px,
50% of the width of the parent element otherwise */
width: 50%; max-width: 500px; min-width: 300px;
}
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
uj5u.com熱心網友回復:
最大寬度覆寫寬度,但最小寬度覆寫最大寬度。
這是在強加互斥要求時使用的規則,它可以更明確地寫成兩個規則
- 最大寬度比寬度更重要
- min-width 比 max-width 更重要
這些的后果如下
- 如果您提供的寬度大于 max-width 元素將不會變得比 max-width 更寬
- 如果您提供的 min-width 大于 max-width 元素將變得比 max-width 寬(以符合 min-width)
uj5u.com熱心網友回復:
只要 min-width 大于 max-width 或 width,元素的寬度就會設定為 min-width 的值。
他們在https://developer.mozilla.org/en-US/docs/Web/CSS/min-width進行了解釋
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/467526.html
下一篇:如何獲得類懸停的索引?
