overflow可以控制超出框內容的顯示方式:隱藏、顯示、滾動顯示
可以取值scroll,表示但凡超出框的內容可以通過滾動條實現瀏覽,但是如下demo卻沒有實現滾動顯示的功能。

於是仔細看了下overflow的定義:overflow 屬性規定當內容溢出元素框時發生的事情。
對比發現, 我理所當然地把body視為元素框了, 於是用div試了下, 發現果然問題出在body上面了。
由此看來:body不是一個元素框

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Demo</title> 6 <style> 7 span{ 8 font-size:30px; 9 } 10 .demo-body{ 11 width:30vw; 12 height:20vh; 13 border: solid red 2px; 14 overflow: scroll; 15 } 16 </style> 17 </head> 18 19 <body> 20 <div class="demo-body"> 21 <span> 22 測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試測試 23 </span> 24 </div> 25 26 </body> 27 </html>
下來又發現了scroll和auto有意思的地方,
scroll: 無論內容有多少,哪怕一個字,這個元素框都會顯示滾動條;
auto:只有內容超出文本框的內容區,才會出現滾動條;