CSS width
CSS width
CSS width属性用于
设置元素内容区域的宽度。
设置元素内容区域的宽度。
它不包括填充边框或边距。它设置元素的边框，边框和边距内部区域的宽度。
CSS宽度值
| 值 | 说明 |
| auto | 这是默认值，用于计算宽度。 |
| length | 用于定义宽度（以px，cm等）。 |
| ％ | 它以％定义包含块的宽度。 |
| initial | 用于将属性设置为其默认值。 |
| inherit | 它用于从其父元素继承属性。 |
CSS width示例：以px为单位的宽度
<!DOCTYPE html>
<html>
<head>
<style>
img.normal {
width: auto;
}
img.big {
width: 150px;
}
p.ex {
height: 150px;
width: 150px;
}
</style>
</head>
<body>
<img class="normal" src="https://img.mushiming.top/app/bianchenghao6_com/2023-11-14-14ca442914534480a804029fd1f37429.jpg" width="95" height="84"><br>
<img class="big" src="https://img.mushiming.top/app/bianchenghao6_com/2023-11-14-14ca442914534480a804029fd1f37429.jpg" width="95" height="84">
<p class="ex">The height and width of this paragraph is 150px.</p>
<p>This is a paragraph.</p>
</body>
</html>
输出：
此段的高度和宽度为150px。
这是一个段落。
CSS宽度示例：宽度（％）
宽度百分比是包含块的度量单位。非常适合图像。
<!DOCTYPE html>
<html>
<head>
<style>
img.normal {
width: auto;
}
img.big {
width: 50%;
}
img.small {
width: 10%;
}
</style>
</head>
<body>
<img class="normal" src="https://img.mushiming.top/app/bianchenghao6_com/2023-11-14-14ca442914534480a804029fd1f37429.jpg" width="95" height="84"><br>
<img class="big" src="https://img.mushiming.top/app/bianchenghao6_com/2023-11-14-14ca442914534480a804029fd1f37429.jpg" width="95" height="84"><br>
<img class="small" src="https://img.mushiming.top/app/bianchenghao6_com/2023-11-14-14ca442914534480a804029fd1f37429.jpg" width="95" height="84">
</body>
</html>
输出：
注意：您还可以使用"最小宽度"和"最大宽度"属性来控制图像的大小。