min-width 属性用于设置元素宽度的下限。
可能的值
- <length> − 任何长度单位。元素的宽度值永远不能小于此值。默认值为 0。
- <length> - 它以包含块宽度的百分比设置元素的最小宽度。
- initial − 将 min-width 的值设置为默认值。
- inherit − min-width 的值继承自其父值。
适用于
所有 HTML 元素,但未替换的内联元素和表格元素除外。
DOM 语法
object.style.minWidth = "50px"
CSS 最小宽度示例
这是另一个示例,演示了在 min-width 属性中使用不同类型的值 -
<html>
<head>
<style>
.box1 {
min-width: 300px;
background-color: yellow;
padding: 20px;
margin-bottom: 5px;
}
.box2 {
min-width: 30%;
background-color: lightgrey;
padding: 20px;
display: inline-block;
margin-bottom: 5px;
}
</style>
</head>
<body>
<div class="box1">This box has a minimum width of 300px</div>
<div class="box2">This box has a minimum width of 30%.</div>
<div class="box2">
This box has a minimum width of 30%. But the content is larger than the min-width.
Hence the value of min-width has no effect. This is a dimensional property which can be styled using CSS.
</div>
</body>
</html>