又是我,又一个新的决赛元素。
我正在尝试使用 HTML 制作游戏,而我现在正在制作主菜单,但一直坚持下去。
背景图片不合适,我已经搜索并尝试了我在互联网上可以找到的所有解决方案,但就是不合适。
body {
background-image: url("main menu bg.png");
background-size: contain;
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center top;
}
<!DOCTYPE html>
<html>
<head>
<link rel = "stylesheet"
type = "text/css"
href = "stylemenu.css" />
<title> Trio of Battles </title>
</head>
<body>
<button button style="background-color: transparent;" onclick="myFunction()"><img src="start button.png"></button>
</body>
</html>
最佳答案
通过将主体高度更改为 100vh,您可以确保没有滚动条。通过包含,图像将始终适合屏幕。
body {
background: url("main menu bg.png")no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: contain;
overflow: auto;
margin: 0;
height: 100vh;
}
关于html - 修复我正在使用 HTML 制作的游戏的背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57972908/