网页背景图片不会加载

时间:2010-10-14 10:40:07

标签: html css

我正在使用以下css来定义我的背景:

body
{
    background-image: url('background.png');
    font-size: 12pt;
    font-family: Veranda, Arial, Helvetica, sans-serif;
}

图像background.png存储在根目录中,但每当我刷新网页时,背景都保持白色。我的导师目前有一份我的文件副本,并试图弄清楚自己,虽然这个问题对他来说并不是很明显。我的完整html和css如下:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<html>
<head>
<meta http-equiv="content-type" content = "text/html charset = utf-8" />
<link rel = stylesheet href = "style.css" type = "text/css" media = screen>
<title>
Title
</title>
</head>

<body>
<div id = "wrapper">
    <div id = "leftsidebar">
        <h3> Navigation </h3>
    </div>

    <div id = "content">
        <h1> Heading 1 </h1>
        <h2> Heading 2 </h2>

        <p align = "justify"> Paragraph 1.</p>

        <p align = "justify"> Paragraph 2 </p>

        <p align = "justify"> Paragraph 3 </p>
    </div>
</div>
</body>

</html>

CSS:

<style type = "text/css">
<!--
body
{
    background-image: url('background.png');
    font-size: 12pt;
    font-family: Veranda, Arial, Helvetica, sans-serif;
}

div#wrapper
{
    width: 80%;
    margin-top: 50px;
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px;
    border: thin solid #000000;
}

div#header
{
    padding: 15px;
    margin: 0px;
    text-align: centre;
}

div#leftsidebar
{
    width: 25%;
    padding: 10px;
    margin-top: 1px;
    float: left;
}

div#content
{
    margin-left: 30%;
    margin-top: 1px;
    padding: 10px;
}

div#footer
{
    padding: 15px;
    margin: 0px;
    border-top: thin solid #000000;
}
-->
</style>

2 个答案:

答案 0 :(得分:2)

CSS文件不应包含

<style type = "text/css">
<!--

我认为这会导致解析第一个CSS块(body)的错误。

答案 1 :(得分:1)

你的style.css

中不允许使用

您需要删除<style type = "text/css">,html评论标记<!--以及每个标记的结束标记。

你也不需要背景网址周围的'',它可以像这样写。

background-image: url(background.png);

进行这些更改,并假设background.png位于正确的目录中,它将起作用。