html - css background-image 不会在 XAMPP for Mac OSX 中显示

<分区>

这个问题是由于错别字或无法再重现的问题引起的。虽然类似的问题可能是on-topic在这里，这个问题的解决方式不太可能帮助 future 的读者。

关闭 7 年前。

由于某些奇怪的原因，我网站上的所有内容都可以正常工作，但我的 div.hero 的背景图像不会显示。这是我的 HTML。

<!doctype html>
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="assets/css/all.css"/>
    <link rel="icon" type="image/png" href="assets/img/favicon.png"/>
  </head>
  <body>
    <header>
      <?php include_once('header.php'); ?>
    </header>
    <main>
      <section>
        <div class="hero">
          <h1>My Awesome Site</h1>
        </div>
      </section>
    </main>
    <footer>
      <?php include_once('footer.php'); ?>
    </footer>
  </body>
</html>

这是我的 CSS

html, body, main, section {
  height: 100%;
  margin: 0;
}
.hero {
  position: relative;
  height: 100%;
  background: url(../img/baby-room.jpg) no-repeat fixed center;
  background-size: cover;
}

最后，我的文件结构在 Applications/XAMPP/xamppfiles/htdocs/ 中找到:

root/
  index.php
  assets/
    css/
      all.css
    img/
      baby-room.jpg
      favicon.png
  header.php
  footer.php

这是真正的疯狂部分。如果我只是在我的 url(../img/baby-room.jpg) 前面添加 rgba(0,0,0,0.5) 我会得到半透明的黑色背景，我应该。这真的让我觉得这是一个路径问题。该路径看起来很稳固，但是当我在单独的窗口中打开该路径时，我看到了一个 403 Access Forbidden 屏幕。

我一辈子都弄不明白发生了什么。起初我以为是 XAMPP 问题，但后来我实时上传了它，但仍然没有用。我试过单引号和双引号，不同的浏览器，无济于事。有什么想法吗？

最佳答案

因为根文件夹包含在 XAMPP 文件夹中，所以 XAMPP 用户需要能够访问计算机上的文件。 XAMPP 默认用户是 daemon。如果您收到 403 Access Forbidden 消息，那是因为 daemon 无权访问这些文件。通过在您选择的文本编辑器中打开 /Applications/XAMPP/xamppfiles/etc/httpd.conf 将 XAMPP 用户更改为您计算机的管理员用户。找到写着

的方 block