CSS overflow属性会如何处理溢出元素内容区的内容？

2 min read

CSS的overflow属性定义了溢出元素内容区的内容应该如何处理。它有以下取值：

  1. visible - 默认值。内容不会被修剪，会呈现在元素框之外。
  2. hidden - 溢出内容会被修剪，不会呈现在元素框之外。
  3. scroll - 溢出内容会被修剪，但是会提供滚动条以便查看元素内的全部内容。
  4. auto - 溢出内容会被修剪，但是只在必要的时候才会提供滚动条以便查看元素内的全部内容。

一般来说，对于可以滚动的页面元素，我们会使用overflow: auto来自动生成滚动条。而对于不可滚动的元素，如图片，我们通常会使用overflow: hidden来截取其中的一部分内容。