关于HTML两侧留白的解决以及解决过程
生活随笔
收集整理的這篇文章主要介紹了
关于HTML两侧留白的解决以及解决过程
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
先上代碼：
<!DOCTYPE html> <html> <head><meta charset="utf-8"><title>title</title> </head><body><div class="box"></div> </body><style>html{background-color: black;}body{height: 300px;background-color: darkgoldenrod;/* padding: 0px; *//* margin: 0px; *//* border: 0px; */}.box{background-color: brown;width: 100%;height: 200px;} </style> </html>頁面效果如下：
這里黑色是html，可以看到是占滿整個頁面的，暗金色是body標簽，紅色是div標簽
從上面可以看出，body標簽是有默認外邊距的
額。。控制臺更容易看出默認外邊距為8
因此，想要消除頂部和左右兩側的留白，就需要消除body的默認外邊距，即
網上很大一部分是
padding: 0px; margin: 0px; border: 0px;是考慮到內邊距和邊框是否有值的問題。
話題之外：
當我把html的背景色注釋掉以后，會發現整個頁面都變成了暗金色，這里body的margin為8并沒有清除，而是當html不設置背景色時，body的背景將作為整個頁面的背景色。從控制臺看margin依舊是那個margin。
總結
以上是生活随笔為你收集整理的关于HTML两侧留白的解决以及解决过程的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 初试BMap时出现BMap is not
- 下一篇： 360浏览器极速模式_【小技巧】解除浏览