2013/01/07

max-width

max-width | min-width | width

設定元素矩形格子的寬。另外可以用 height 設定矩格的高。

max-width

設定元素矩格的最大寬度,不可為負值;只能用在區塊元素。可設為:

  1. 長度:用長度設定元素的寬度。
  2. 百分比:相對於包納區塊寬度的百分比。如果包納區塊的寬度沒有宣告,而是由內容決定其寬度,則此參數與 auto 相同。
  3. inherit:繼承父元素特徵。

元素矩格的寬度不可超過 max-width,如果 width 小於 max-width,會以 width 作為矩格的寬度。元素只有設 max-width 時,會以其值為矩格的寬度。

  • IE6 無此項;Firefox, Safari, Chrome 有支援。

CSS hack max-width。IE6 沒有 max-width,可以利用 expression() 與 clientWidth 達成 max-width 的功能。expression() 限用於 IE6, IE7。下例中

  1. IE6 不認得 max-width:該行會被 IE6 忽略;IE7, IE8, Firefox, Safari, Chrome 可正確解讀。
  2. IE8, Firefox, Safari, Chrome 不認得 expression(),該行會被忽略。
  • 上例中,必須加上 overflow:auto,否則 IE6 會延伸寬度。這與真正的 max-width 有差異。