出于某种原因，当我运行我的代码时，我的所有背景图像元素都没有显示。它正在被覆盖，这通过在 inspect element > STLyes 输出中被划掉来显示。
如何在不使用 !important 标签的情况下摆脱这种覆盖？ 我所需要的只是让我的图像出现!我可能遗漏了一些显而易见的东西。
body {
background-image: "images/bg.png";
}
#headNav {
top: 0;
background-image: "images/header.png";
height: 70px;
display: block;
}
#dash {
background-image: "images/dash.png";
height: 800px;
width: 600px;
display: block;
}
#testCanvas {
margin: auto;
position: absolute;
left: 0;
right: 0;
}
#snowFlakeSliders {
position: relative;
margin: 0 auto;
top: 450px;
margin-left: 300px;
}
input {
margin: 10px;
}
#attribute {
margin-right: 10px;
}<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Canvas Test Using Double Buffering</title>
<link type="text/css" rel="stylesheet" href="slider4.css">
</head>
<body onload="init()">
<div id="headNav"></div>
<div id="dash">
<canvas id="testCanvas" width="400" height="400">
Canvas not supported
</canvas>
<div id="snowFlakeSliders">
<p id="attribute">Speed</p> <span id="sliderStatus" class="sliderSpan">50</span>
<input type="range" min="0" max="100" value="50" step="2" onchange="sliderChange(this.value)" />
<br />
<br />
<p id="attribute">Width</p> <span id="sliderWidth" class="sliderSpan">5</span>
<input type="range" min="0" max="10" value="5" step="1" onchange="sliderChangeWidth(this.value)" />
<br />
<br />
<p id="attribute">Height</p> <span id="sliderHeight" class="sliderSpan">100</span>
<input type="range" min="0" max="200" value="100" step="1" onchange="sliderChangeHeight(this.value)" />
<br />
<br />
</div>
</div>
</body>
<script src="slider4.js"></script>
</html>最佳答案
尝试让你的背景图片值 url("image_path_here.png")
示例:background-image: url("images/bg.png");
希望这对您有所帮助!
关于html - 如何在开发工具中修复 CSS 属性的覆盖？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29908104/