HTML 和 CSS 背景图像未显示

新手上路,请多包涵

我已经仔细检查了我的 URL 和文件名,但我似乎无法显示图像。为什么会这样?这是我的代码(注意 <p> 在 body 标签内,我没有添加完整代码,我只添加了头部和具体问题)。

 <html>
  <head>
     <title>Head First Lounge.</title>
      <link type="text/css"
            rel="stylesheet"
            href="stylesheet/style.css"
            media="screen"/>
  </head>

<p class = "guarantee">
     Our guarantee: at the lounge, we're committed to providing you,
     our guest, with an exceptional experience every time you visit.
     Whether you're just stopping by to check in on email over an
     elixir, or are here for an out-of-the-ordinary dinner, you'll
     find our knowledgeable service staff pay attention to every detail.
     If you're not fully satisfied, have a Blueberry Bliss Elixir on us.
</p>

这是那部分的 CSS 规则

.guarantee{
        background-image: url(images/background.gif);
        font-family: "Geogia", "Times New Roman", Times, serif;
        border-color: black;
        border-width: 1px;
        border-style: solid;
        background-color: #a7cece;
            padding: 25px;
            margin: 30px;
            line-height: 1.9em;
            font-style: italic;
            color: #444;
}

原文由 user962206 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 218
2 个回答

试试这个:

 background-image: url(../images/background.gif);

没有 ../ 它正在寻找样式表文件夹中不存在的图像文件夹。所以你必须回到图像文件夹所在的目录。

编辑:你也可以像这样缩短你的 CSS 样式:

 .guarantee{
    background: #a7cece url(../images/background.gif);
    border: 1px solid black;
}

原文由 Drew 发布,翻译遵循 CC BY-SA 3.0 许可协议

此时浏览器将在您的样式表目录中搜索图像。

可能值得尝试改变

background-image: url(images/background.gif);

background-image: url(/images/background.gif);

这可能是问题的原因。

原文由 KingCronus 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题