1.由于页面中的html和body默认高度都是自适应的，所以单单给盒子设置高度100%是没有效果的，应该给html和body同时设置高度100%，这样才能把盒子撑开。
但是又由于body默认有margin外边距，所以只设置高度会出现竖向的滚动条。需要设置margin：0；
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>成功设置100%高度去除滚动条</title> 6 <style type="text/css"> 7 html,body{ 8 height: 100%; 9 } 10 body{ 11 margin: 0; 12 } 13 </style> 14 </head> 15 <body> 16 <div style="height: 100%;background-color: #4d85d1"> 17 所在div设置高度100% 18 </div> 19 </body> 20 </html>