CSS max-width 属性 · W3School CSS 参考手册

# CSS max-width 属性 ## 实例设置段落的最大宽度： ``` p { max-width:100px; } ``` ## 浏览器支持 | IE | Firefox | Chrome | Safari | Opera | | --- | --- | --- | --- | --- | 所有主流浏览器都支持 max-width 属性。注释：任何版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。 ## 定义和用法 max-width 定义元素的最大宽度。 ### 说明该属性值会对元素的宽度设置一个最高限制。因此，元素可以比指定值窄，但不能比其宽。不允许指定负值。 | 默认值： | none | | --- | --- | | 继承性： | no | | --- | --- | | 版本： | CSS2 | | --- | --- | | JavaScript 语法： | _object_.style.maxWidth="50px" | | --- | --- | ## 可能的值 | 值 | 描述 | | --- | --- | | none | 默认。定义对元素的最大宽度没有限制。 | | _length_ | 定义元素的最大宽度值。 | | _%_ | 定义基于包含它的块级对象的百分比最大宽度。 | | inherit | 规定应该从父元素继承 max-width 属性的值。 | ## TIY 实例 [使用像素值来设置元素的最大宽度](/tiy/t.asp?f=csse_dim_max-width) 本例演示如何使用像素值来设置元素的最大高度。 ``` <html> <head> <style type="text/css"> p { max-width: 300px } </style> </head> <body> <p>这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。</p> </body> </html> ``` [使用百分比来设置元素的最大宽度](/tiy/t.asp?f=csse_dim_max-width_percent) 本例演示如何使用百分比值来设置元素的最大高度。 ``` <html> <head> <style type="text/css"> p { max-width: 50% } </style> </head> <body> <p>这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。这是一些文本。</p> </body> </html> ``` ## 相关页面 CSS 教程：[CSS 尺寸](/css/css_dimension.asp "CSS 尺寸 (Dimension)") CSS 参考手册：[CSS min-width 属性](/cssref/pr_dim_min-width.asp "CSS min-width 属性") HTML DOM 参考手册：[maxWidth 属性](/jsref/prop_style_maxwidth.asp "HTML DOM maxWidth 属性")