min-width最小寬度與max-width最大寬度

1、實際應用說明    

最小寬度(min-width)與最大寬度(max-width)用於設置圖片最小最大寬度限制比較多。好比一個圖片爲主列表，對象裏圖片大小不定時候，爲了避免想讓他過小不統一這個時候咱們可使用css最小寬度樣式。再如，一個盒子裏有文章有圖片混排的時候，有時圖片寬度不能肯定，這個時候若是html img圖片寬度超出了div盒子寬度，可能圖片就會撐破div盒子形成圖片混亂。

2、min-width與max-width用法案例     

咱們設置2個div盒子，分別設置最大與最小寬度樣式、同時設置css邊框爲1px css顏色爲紅色的實線盒子、css高度爲100px。第一和第二個盒子CSS命名分別爲divcss5-min-width、.divcss5-max-width；第一個盒子內圖片原圖片大小爲寬爲165px 高度60px；第二個盒子內圖片原圖片大小爲寬度爲375px 高度65px。

一、案例css代碼

二、CSS+DIV案例html源代碼片斷

三、案例在瀏覽器效果截圖

四、max-width最大寬度與min-width最小寬度案例小結
咱們設置兩個盒子一個「divcss5-min-width」設置對象裏img圖片最小寬度爲200px，而實際圖片只有165px，因此圖片被拉伸到 200px；一個「divcss5-max-width」設置對象裏img圖片最大寬度爲200px限制，而實際對象裏圖片寬度是375px，這個時候咱們設置了此圖片最大寬度爲200px,因此圖片被CSS max-height縮小到200px

3、max-width與min-width總結     

Css max-width與css min-width能夠同時在一個CSS選擇器使用設置一個對象最大最小寬度樣式。通常對圖片對象設置此兩項樣式比較多，但在IE6中不支持此兩個屬性，IE7及以上瀏覽器均支持，這個時候咱們須要IE6支持兼容CSS min-width、ie6兼容max-width方法（http://www.divcss5.com/jiqiao/j298.shtml）。