CSS max-width 属性值说明
| 值 | 描述 |
|---|---|
| auto | 设置最大宽度。这是此属性的默认值。 |
| length | 定义PX,PT,CM等中的最大宽度。默认值为0。 |
| % | 设置包含元素%的最大宽度。 |
| initial | 使属性使用其默认值。 |
| inherit | 从父母元素继承属性。 |
max-width 属性用于设置元素的最大宽度。
此属性可防止 width 属性的值变得大于为 max-width 指定的值。
同时,max-width 属性覆盖 width 属性,CSS min-width 属性覆盖 max-width 属性。
| 初始值 | none |
|---|---|
| 应用于 | 所有元素,但未替换的内联元素,表行和行组。 |
| 继承 | 无效 |
| 可动画的 | 是的。宽度是有动画的。 |
| 版本 | CSS2. |
| DOM 语法 | object.Style.maxwidth =“500px”; |
语法
max-width: none | length | initial | inherit;
max-width 属性的示例:
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
div {
max-width: 50%;
background-color: #1c87c9;
}
</style>
</head>
<body>
<h2>Max-width 属性示例</h2>
<div>将这段文本的最大宽度定义为 50%.</div>
</body>
</html>
定义为“px”和“em”的 max-width 属性示例:
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
div {
max-width: 250px;
background-color: #8ebf42;
}
p {
max-width: 20em;
background-color: #ccc;
color: #fff;
}
</style>
</head>
<body>
<h2>Max-width 属性示例</h2>
<div>这个div元素的最大宽度定义为250px。</div>
<p>本段的最大宽度定义为 20em。</p>
</body>
</html>
日期:2020-06-02 22:14:39 来源:oir作者:oir
