gpt4 book ai didi

javascript - 我正在尝试使用 HTML 制作 GUI,但我的 CSS 代码未加载。我不确定错误是什么

转载 作者:行者123 更新时间:2023-11-28 02:36:25 25 4
gpt4 key购买 nike

我为 html 和 CSS 制作了两个单独的文件,但没有用。然后我在 HTML 中添加了 CSS。这样做之后,它开始在网页上显示 CSS 代码。

/**
* Load the main menu
*/
assetLoader.finished = function() {
mainMenu();
}
/**
* Show the main menu after loading all assets
*/
function mainMenu() {
$('#main').show();
}
/**
* Click handlers for the different menu screens
*/
$('.play').click(function() {
$('#menu').hide();
startGame();
});
*, *:before, *:after {
box-sizing: border-box;
}
#menu.main {
background-image:url('board.png’);
}
#main {
display: none;
height: 60%;
overflow: auto;
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
#main h1 {
color: white;
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
.button {
display: block;
width: 150px;
margin: 0 auto;
height: 30px;
line-height: 30px;
border: 1px solid #AA2666;
color: white;
font-weight: bold;
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
background-color: #FB1886;
background-image: -webkit-linear-gradient(bottom, #FB1886 0%, #B30D5D 100%);
background-image: linear-gradient(to bottom, #FB1886 0%, #B30D5D 100%);
border-radius: 5px;
}
.button:hover {
background-color: #B30D5D;
background-image: -webkit-linear-gradient(bottom, #B30D5D 0%, #FB1886 100%);
background-image: linear-gradient(to bottom, #B30D5D 0%, #FB1886 100%);
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-16″>
<title>Game Engine</title>
<link rel = "stylesheet" type= "text/css" href="ChessDisp.css" media= “screen”>


<script type="text/javascript" src= “game.js”> </script>

</head>
<body>
<div class="wrapper">
<div id="menu" class="main">
<div id="main">
<h1>Game-Engine</h1>

<h3> Welcome </h3>
<h2>Select the Game Mode</h2>

<button type="button" onclick="" >Play</button> <br>
<button type="button" onclick="" >Pause</button> <br>
<button type="button" onclick="" >Help</button> <br>
<button type="button" onclick="" >About Game</button> <br>
<button type="button" onclick="" >Settings</button> <br>
<button type="button" onclick="" > License</button>

</div>
</div>
<canvas id="canvas" width="800" height="480">

</canvas>
</div>
<script type="text/javascript" src="main.js”> </script>
</body>
</html>

我已经尝试了很多次运行,但我认为 html 文件存在一些问题。附言我是编程新手,所以我不确定出了什么问题。我早些时候在 Pycharm 上运行它,但它无法检测 HTML 中的链接 rel 命令,我在记事本上运行它并删除了真实链接,但它再次无法正常工作。

最佳答案

你说的是 media= “screen” 而不是 media= "screen"

HTML 属性值不能用 U+201C(左双引号)和 U+201D(右双引号)分隔。

您必须使用 U+0022(引号)或 U+0027(撇号)。

观察区别:

pre { font-size: 400% }
<pre>media= “screen”
media= "screen"</pre>


同样,您说 background-image:url('board.png'); 使用 U+2019(右单引号)而不是 U+ 0027(撇号)。


您还使用了类选择器 .button 但没有包含 class="button" 的元素。也许您指的是类型选择器按钮

关于javascript - 我正在尝试使用 HTML 制作 GUI,但我的 CSS 代码未加载。我不确定错误是什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47388171/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com