关于页面无法实现高度100%的原因及实现方法。
生活随笔
收集整理的這篇文章主要介紹了
关于页面无法实现高度100%的原因及实现方法。
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
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>?
轉載于:https://www.cnblogs.com/liweiz/p/10761253.html
《新程序員》:云原生和全面數字化實踐50位技術專家共同創作,文字、視頻、音頻交互閱讀總結
以上是生活随笔為你收集整理的关于页面无法实现高度100%的原因及实现方法。的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Python学习笔记1环境搭建
- 下一篇: 『Lucas定理以及拓展Lucas』