CSS width 属性

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

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <style>
    img.normal {
      height: auto;
    }

    img.big {
      height: 120px;
    }

    p.ex {
      height: 100px;
      width: 100px;
    }
  </style>
</head>

<body>
  <img class="normal" src="/examples/logocss.gif" width="95" height="84" /><br>
  <img class="big" src="/examples/logocss.gif" width="95" height="84" />
  <p class="ex">这个段落的高和宽是 100px.</p>
  <p>这是段落中的一些文本。这是段落中的一些文本。 这是段落中的一些文本。这是段落中的一些文本。 这是段落中的一些文本。这是段落中的一些文本.
  </p>
</body>
</html>

尝试一下 »

属性定义及使用说明

width属性设置元素的宽度。

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

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

浏览器支持

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

属性
width 1.0 4.0 1.0 1.0 3.5

属性值

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

更多实例

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

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <style>
    img.normal {
      width: auto;
    }

    img.big {
      width: 50%;
    }

    img.small {
      width: 10%;
    }
  </style>
</head>

<body>
  <img class="normal" src="/examples/logocss.gif" width="95" height="84" /><br>
  <img class="big" src="/examples/logocss.gif" width="95" height="84" /><br>
  <img class="small" src="/examples/logocss.gif" width="95" height="84" />
</body>
</html>

尝试一下 »

相关文章

CSS 教程: CSS Dimension

CSS 教程: CSS Box model

CSS 参考手册: height 属性