CSS width 属性
❮ 上一节
CSS 参考手册
下一节 ❯
实例
设置三个 div 元素的宽度:
div.a { width: auto; border: 1px
solid black;}div.b { width: 150px;
border: 1px solid black; }div.c { width:
50%; border: 1px solid black; }
亲自试一试 »
下面有更多实例。
定义和用法
width 属性设置元素的宽度。
元素的宽度不包括填充、边框或边距!
注释: min-width 和
max-width 属性将替代 width 属性。
默认值:
auto
继承性:
no
支持动画:
yes. 阅读有关动画的信息
测试一下
版本:
CSS1
JavaScript 语法:
object.style.width="500px"
测试一下
浏览器支持
表中的数字表示支持该属性的第一个浏览器版本。
属性
width
1.0
4.0
1.0
1.0
3.5
语法
width: auto|value|initial|inherit;
属性值
值
描述
试一试
auto
默认值。浏览器可计算出实际的宽度。
亲自试一试 »
length
使用 px、cm 等单位定义宽度。阅读长度单位
亲自试一试 »
%
定义基于包含块(父元素)宽度的百分比宽度。
亲自试一试 »
initial
将此属性设置为其默认值。请参阅 initial
亲自试一试 »
inherit
从其父元素继承此属性。请参阅 inherit
更多实例
实例
使用百分比值设置 img 元素的宽度:
img { width: 50%;}
亲自试一试 »
实例
将元素的宽度设置为 100px。但是,当它获得焦点时,将其设置为 250px 宽:
input[type=text] { width: 100px;}
input[type=text]:focus { width: 250px;}
亲自试一试 »
相关页面
CSS 教程: CSS 高度和宽度
CSS 教程: CSS 盒子模型
CSS 参考手册: height 属性
HTML DOM 参考手册: width 属性
❮ 上一节
CSS 参考手册
下一节 ❯