我不知道为什么这个 ccs 文本不起作用...背景应该有颜色。 如果有人看到我的错误,谢谢!
我必须添加更多细节,但我认为你们所有人都清楚,如果不只是问! 谢谢!
<html>
<head>
<style type="css/text">
#my_canvas {
margin: 10;
background-color: white;
border:black 3px solid;
}
Body {
background-color: slategrey;
}
</style>
</head>
<body>
<script type="text/javascript">
var bg = new Image();
var sh = new Image();
var po = new Image();
bg.src = "ruimte.jpg";
sh.src = "schiet.jpg";
po.src = "pop.gif";
function Canvas(){
var ctx = document.getElementById('my_canvas').getContext('2d');
var afst = 10;
function background () {
this.x = 0, this.y = 0, this.w = bg.width, this.h = bg.height;
this.draw = function() {
this.x -= 2;
ctx.drawImage(bg,this.x,this.y);
if(this.x <= -499) {this.x = 0;}
}
}
function blok () {
this.x = 0, this.y = 0, this.w = 40, this.h = 40, this.color = "orange";
this.draw = function() {
//ctx.fillStyle = this.color;
//ctx.fillRect(this.x,this.y,this.w,this.h);
ctx.drawImage(po,this.x,this.y);
}
}
var background = new background();
var blok = new blok();
function draw() {
ctx.save();
ctx.clearRect(0,0,ctx.canvas.width,ctx.canvas.height);
//draw
background.draw();
blok.draw();
ctx.restore();
}
var animateInterval = setInterval(draw,30);
document.addEventListener('keydown', function(event) {
var key_press = String.fromCharCode(event.keyCode);
//alert(event.keyCode+" | "+key_press);
if(event.keyCode == 40) { blok.y += afst}
if(event.keyCode == 37) { blok.x -= afst}
if(event.keyCode == 39) { blok.x += afst}
if(event.keyCode == 38) { blok.y -= afst}
if(event.keyCode == 32) { alert("hoi")}
});
}
window.addEventListener('load', function(event) {
Canvas();
});
</script>
<canvas id="my_canvas" width=1000px" height="500px">
Please get a new browser to watch canvas!
</canvas>
</body>
最佳答案
css/text
不是浏览器可识别的样式表格式,因此它们会忽略您的样式表。你是说 text/css
。
从 HTML 5 开始,type
属性对于 style
元素是可选的,因此完全省略它可以避免此类错误。
关于html - 为什么我的 CSS 不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25078542/