css width属性 CSS width 属性

css width属性

CSS width 属性是用来设置元素的宽度的，它可以接受任何长度单位，包括百分比和像素。它可以用来设置元素的最小宽度、最大宽度、固定宽度或者自动调整元素的宽度。

div { 
    width: 100px; 
} 

上面的代码将 div 的宽度设为 100 像素。如果要将 div 的宽度设为 50%，则可以使用如下代码：

div { 
    width: 50%; 
} 

width 属性也可以用来设置元素的最小和最大宽度。例如，要将 div 的最小和最大宽度都设为 200 像素，则可以使用如下代码：

 
div { 
    min-width: 200px; 
    max-width: 200px; 
}  												   

此外，width 属性还可以用来自动调整元素的宽度。例如，要将 div 的宽度根据内部内容进行自动调整，则可以使用如下代码：

div { 
     width: auto;  } 

在 CSS3 中还引入了一些新的长度单位（vw、vh、vmin、vmax 等）。这些新的长度单位也可以用来控制元素的大小。例如，要将 div 的大小控制在 50% - 100% 这一区间内，则可以使用如下代码：

div {   width: 50vw;   max-width: 100vw; } 

总之，CSS width 属性是一个非常强大而重要的属性。通过正确使用该属性，我们可以很方便地控制元素的大小和布局。

CSS width 属性

CSS width 属性

属性定义及使用说明

width属性设置元素的宽度。

注意： width属性不包括填充，边框和页边距！

默认值：	auto
继承：	no
版本：	CSS1
JavaScript 语法：	object.style.width="50px"

---

属性值

值	描述
auto	默认值。浏览器可计算出实际的宽度。
length	使用 px、cm 等单位定义宽度。
%	定义基于包含块（父元素）宽度的百分比宽度。
inherit	规定应该从父元素继承 width 属性的值。

---

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

属性
width	1.0	4.0	1.0	1.0	3.5

---

实例

实例

设置一个段落的高度和宽度：

p.ex
{
height:100px;
width:100px;
}

---

更多实例

使用百分比来设置元素的宽度
本例演示如何使用百分比值来设置元素的宽度。

---

相关文章

CSS 教程: CSS Dimension

CSS 教程: CSS Box model

CSS 参考手册: height 属性