當子元素的尺寸超過父元素的尺寸時，需要設置父元素顯示溢出的子元素的方式，設置的方法是通過overflow屬性來設置。
1.overflow的設置項
1、visible 默認值。內容不會被修剪，會呈現在元素框之外。
2、hidden 內容會被修剪，並且其餘內容是不可見的，此屬性還有清除浮動、清除margin-top塌陷的功能。
3、scroll 內容會被修剪，但是瀏覽器會顯示滾動條以便查看其餘的內容。
4、auto 如果內容被修剪，則瀏覽器會顯示滾動條以便查看其餘的內容。
5、inherit 規定應該從父元素繼承 overflow 屬性的值。
2.overflow使用演示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>元素溢出</title>
<style type="text/css">
.box{
width:300px;
height:200px;
border:1px solid #000;
margin:50px auto 0;
background-color:gold;
line-height:30px;
/*
visible:缺省值，溢出的元素可見;
hidden：將溢出的元素裁切隱藏
scroll:顯示滾動條，不管是否溢出;
auto：溢出的時候產生滾動條，不溢出的時候不顯示滾動條
*/
overflow:auto;
}
</style>
</head>
<body>
<div class="box">當子元素的尺寸超過父元素的尺寸時，需要設置父元素顯示溢出的子元素的方式，設置的方法是通過overflow屬性來設置。當子元素的尺寸超過父元素的尺寸時，需要設置父元素顯示溢出的子元素的方式，設置的方法是通過overflow屬性來設置。當子元素的尺寸超過父元素的尺寸時，需要設置父元素顯示溢出的子元素的方式，設置的方法是通過overflow屬性來設置。</div>
</body>
</html>
