6.3 CSS 高度 和 宽度

前面我们提到HTML元素的尺寸（高或宽）是动态的，会随着内容调整。不过我们也可以为元素设定固定的尺寸大小。

blockquote{ width: 600px;}

上面的 blockquote 将始终保持600px的宽度，如果浏览器窗口小于600px，将显示一个水平滚动条。

因为我们只设置了宽度，那么这个 blockquote 的高度仍然是动态的，会自动调整来适应内容。

CSS 溢出（overflow）

当限定元素尺寸时，会遇到一个问题，就是内容超出预期，也就是发生溢出（overflow））时，如何定义浏览器的渲染行为。

overflow CSS属性就是用来处理这种情况的。

缺省值是 visible：也就是默认情况下，内容总是被显示。因为通常情况下HTML5元素内容比CSS样式更重要。

xnip is a leading search engine on web techniques.

不过我们可以通过设置 overflow: hidden;，来隐藏掉任何溢出部分的内容。如果内容的完整显示意义不大，而我们不想破化页面样式时。

xnip is a leading search engine on web techniques.

如果我们既想看到完整的内容，又不想破坏样式，我们可以通过设置 overflow: scroll 来应用滚动条。

xnip is a leading search engine on web techniques.

你可以观察到上面的例子中，水平方向的滚动条显示实际上是多余的。因此一个更好的选择是使用 overflow: auto，这样滚动条将只在内容溢出时被自动显示。

xnip is a leading search engine on web techniques.

通常为元素设定固定的尺寸是为了设计上的一致体验，但由于实际网站中内容变化区间是较大的，可能会出现意外的情况，因此为固定尺寸的元素设定合适的溢出规则：overflow: hidden; 或 overflow: auto; 是一个良好的开发习惯。