如何摆脱页面边缘的空白? [英] How can I get rid of the gap at the edge of the page?
本文介绍了如何摆脱页面边缘的空白?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我已经将正文和两个div的边框,填充和边距设置为0px.但是我似乎仍然无法摆脱差距.
I already set the border, padding and margin to 0px for the body and two of my divs. But I still can't seem to get rid of the gap.
#body{
padding: 0px ;
border:0px ;
margin:0px;
width:100%;
height:100vh;
}
#mainPage {
height:100vh;
width:100%;
background-color: #2469ff;
padding: 0px;
border:0px;
margin:0px;
}
#navBar{
height:70px;
width:100%;
Background-color: #1f1f1f;
padding: 0px ;
border:0px ;
margin:0px;
}
到目前为止,这就是我所有的CSS.
That's all my CSS so far.
这是我的HTML.目前,这是非常基本的.
Here is my HTML. It's very basic at the moment.
<html>
<head>
<title>
Ice Arena
</title>
</head>
<body>
<div id="mainPage">
<div id="navBar">
</div>
<div id="leftPanel">
</div>
</div>
</body>
</html>
正如我所说,我不知道为什么要这么做.我确定我弄错了,我仍然是CSS和HTML的初学者.
As I said, I don't know why it's doing this. I'm sure I made a mistake, I'm still a beginner with CSS and HTML.
推荐答案
添加以下CSS margin
重置:
Add the following CSS margin
reset:
html,
body {
margin: 0;
}
以下代码段:
html,
body {
margin: 0;
}
#body {
padding: 0px;
border: 0px;
margin: 0px;
width: 100%;
height: 100vh;
}
#mainPage {
height: 100vh;
width: 100%;
background-color: #2469ff;
padding: 0px;
border: 0px;
margin: 0px;
}
#navBar {
height: 70px;
width: 100%;
Background-color: #1f1f1f;
padding: 0px;
border: 0px;
margin: 0px;
}
<body>
<div id="mainPage">
<div id="navBar">
</div>
<div id="leftPanel">
</div>
</div>
</body>
这篇关于如何摆脱页面边缘的空白?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文