英文:
Body isn't taking cover of the whole screen
问题
在我的CSS中:
body {
background-color: black;
color: white;
margin: 0;
font-family: 'Montserrat', sans-serif;
padding: 0;
/* animation: scroll 5s; */
}
在这段代码之后,浏览器中的body
仍然没有占满整个屏幕,检查元素时显示其具有1536417的尺寸,即使我的屏幕尺寸是19201080。
我尝试使用100vh的高度,但这样做会使相对定位的元素出现问题。
英文:
In my css:
body {
background-color: black;
color: white;
margin: 0;
font-family: 'Montserrat', sans-serif;
padding: 0;
/* animation: scroll 5s; */
}
After this code in the body tag, the body is still not taking up the whole screen in browser, in inspect it shows that it has 1536 * 417 dimension, even when my screen size is 1920*1080
I tried using 100vh height, but made it worse by messing up the posotion relative elements.
答案1
得分: 0
你的网站中是否导入了任何UI框架或其他CSS,可能会对其产生一些奇怪的影响?
在不知道你的最终目标是什么以及为什么要覆盖整个屏幕时,body { height: 100vh; }
或者这段代码应该可以工作:
html {
height: 100%;
}
body {
min-height: 100%;
}
还要确保你的浏览器窗口已经缩放到了100%。在Windows上可以使用 CTRL+0
快捷键。
英文:
Do you have any UI frameworks or other CSS imported into your site that might be doing some funny stuff to it?
Without knowing what your end goal is and why you want to cover the whole screen body { height: 100vh; }
or this should work:
html {
height: 100%;
}
body {
min-height: 100%;
}
Also make sure you have zoomed your browser window too 100%. CTRL+0
on Windows.
答案2
得分: 0
如果您正在导入其他CSS文件,请在您的CSS文件中添加以下代码:
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
检查这个答案,然后评论您的问题是否已解决。
英文:
If you are importing any other CSS files. Then add these lines in your CSS file
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
Check this answer then comment whether your problem solved or not
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论