overflow溢出部分显示效果

overflow 溢出部分显示效果

• 溢出部分：指的是盒子内容部分所超出盒子范围的区域
• 场景：控制内容溢出部分的显示效果，如：显示、隐藏、滚动条…
• 属性名：overflow
• 常见属性值：

属性值	效果
visible	默认值，溢出部分可见
hidden	溢出部分隐藏
scroll	无论是否溢出，都显示滚动条
auto	根据是否溢出，自动显示或隐藏滚动条

• 默认情况（文字超出div盒子，页面不协调）
  

• 给盒子添加 overflow: scroll; （无论是否溢出，都显示滚动条）

        div {
            height: 300px;
            width: 300px;
            background-color: pink;
            
            overflow: scroll;
        }