一、基本含義
min-width 屬性為給定元素設(shè)置最小寬度。它可以阻止 width 屬性的應(yīng)用值小于 min-width 的值。min-width 的值會同時(shí)覆蓋 max-width 和 width。
二、可取值
常用百分比、固定px|em|ex等,其他屬性值如max-content,min-content兼容性很不好。
div{min-width:100em;}
div{min-width:800px;}
……
三、兼容性
IE7+,常用現(xiàn)代瀏覽器,關(guān)于IE6的兼容處理,建議使用js控制,IE6將逐漸退出前端舞臺。
四、應(yīng)用
常用在百分比寬度布局中,縮放瀏覽器窗口,以免窗口很小時(shí)影響頁面的布局 美觀。
相關(guān)屬性:max-width,min-height,max-height
我們在做布局設(shè)計(jì)時(shí),經(jīng)常有這樣的布局,兩邊或者一邊是導(dǎo)航類工具欄 ,中間是內(nèi)容區(qū)域。
但我們希望中間的內(nèi)區(qū)域能夠自動適應(yīng),隨著不同的分辨率和瀏覽器的大小自動適應(yīng)高度和寬度,以獲得較好的顯示效果。
我們假設(shè)中間的內(nèi)容區(qū)域是個div,如果我們不明確設(shè)置它樣式的width屬性,它是可以自動適應(yīng)的,按說這滿足了要求。
但是當(dāng)瀏覽器的寬度過小時(shí),小到已經(jīng)不能整齊的顯示我們的內(nèi)容,頁面的顯示就會混亂不堪。
這時(shí)我們可以為該內(nèi)容div設(shè)置一個min-width,比如在css中:
新聞熱點(diǎn)
疑難解答
圖片精選