【往期文章】
1. 盒模型内容区
内容(content)可以是文本、图像。支持属性:height、width、overflow。
1.1 overflow属性
overflow属性值见下表:
值 | 描述 |
---|---|
visible | 默认值。内容不会被裁剪,会呈现在元素之外 |
hidden | 内容会被裁剪,并且其余内容是不可见的。 |
scroll | 内容会被裁剪,但是浏览器会显示滚动条以便查看其余的内容 |
auto | 如果内容被裁剪,浏览器显示滚动条来查看其余内容 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>内容溢出</title>
<style>
.parent{
width: 200px;
height: 200px;
background-color: #FFD758;
overflow: hidden;
}