Question

我想为我的页面设置背景图片，但是当我使用CSS设置它时它不会显示，我的BG仍然是空白的。这是我的CSS代码：

body {
background-image: url("Images/bg.png");
}

hr {
margin-left: 12%;
margin-right: 12%;
color: #000000;
background-color: #000000;
height: 3px;
}

h1 {
text-align: center ;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 300%;
}

h3 {
text-align: left ;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 150%;
}

#menu {
text-align: center;
}

.titles {
margin-left: 12%;
margin-right: 12%;
}

p {
text-align: justify ;
font-family: Verdana;
margin-right: 12%; 
margin-left: 12%; 
}

这是我的HTML代码：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="Homepagina Olympische Spelen" />
<meta name="keywords" content="welkom, homepagina, olympische spelen, olympic games, sporten" /> 

<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" /> 
<link rel="icon" href="images/favicon.ico" type="image/x-icon" /> 

<link href="styles/eersteStijl.css" rel="stylesheet" type="text/css">
<title>Olympische Zomerspelen</title>

</head>

<body>

<h1>Olympische Spelen</h1>

<div id="menu">
<a href="index.html"><img
src="images/buttons/home_btn.png"
alt=""
onmouseover="this.src='Images/buttons/home_btn_rollover.png';"
onmouseout="this.src='Images/buttons/home_btn.png';"
/></a>

<a href="info.html"><img
src="images/buttons/info_btn.png"
alt=""
onmouseover="this.src='Images/buttons/info_btn_rollover.png';"
onmouseout="this.src='Images/buttons/info_btn.png';"
/></a>

<a href="contact.html"><img
src="images/buttons/contact_btn.png"
alt=""
onmouseover="this.src='Images/buttons/contact_btn_rollover.png';"
onmouseout="this.src='Images/buttons/contact_btn.png';"
/></a>
</div>

<hr>

<div class="titles"><h3>Welkom</h3></div>
<p>
[Some text here]

<p>
<video width="320" height="240" poster="images/video_start.jpg">
<source src="Images/olympic_games_promo.mp4" /> 
<source src="Images/olympic_games_promo.webm" />
Uw browser ondersteunt geen video.
</video>
</p>

<div class="titles"><h3>Olympische Spelen</h3></div>
<p>
[More text]
</p>

<div class="titles"><h3>Amateurs en beroepsporten</h3></div>
<p>
[And more text] 
</p>

<p>
<img src="Images/olympisch_stadion.jpg" alt="Olympisch Stadion" /> <br> 
<i>Olympisch Stadion in Athene</i>
</p>

</body>
</html>

除了BG图像之外，CSS中的所有内容都有效，是否有人有想法？

提前致谢。

Answer 1

你的道路是错的。您的样式表位于样式文件夹中。

你需要＆＃34; /Images/bg.png"去根

HTML / CSS背景图像不显示

1 个答案: