主页 / coding / 问题 / 79009569
Accepted
Cecil Ward
Asked: 2024-09-21 20:30:06 +0800 CST

CSS 背景图像不显示

  • 772

我有一个具有宽度和高度的 CSS 样式的 span 元素以及一个背景图像，虽然屏幕上保留了一个预期大小的框，但它并没有出现。

如果我尝试使用不同的 jpg 文件，则另一幅图像会成功显示。“坏”图像与 .css 文件位于同一目录中，与好的 .jpg 位于同一位置。我尝试使用在线 jpg.repair 工具以防文件以某种方式损坏，但无济于事。

我还尝试将 .jpg 转换为 png，幸运的是，我记得在 CSS 中适当更改了文件名。还是没用。由于其他图像显示正常，我假设这与特定文件有关，但 .png 也没有显示。

我尝试重命名文件，并相应地更改 CSS，以防万一某个错误意味着浏览器（Safari iPadOS）不喜欢该文件名。绝望没有回报。CSS 并不坏，因为其他图像确实会显示。CSS 大致是：background: url("buidheag-in-grass-small.jpg") no-repeat top center; - 如果我没记错的话。图像文件在单独的 .css 文件中引用，而不是在 xhtml 中内联。我在装有 iPadOS 17.x 的 iPad 上使用 Safari。Web 服务器引擎是 Apache/linux。Apache 明确设置为为 .jpg 文件提供正确的 mime 类型。

我完全被难住了。我读过其他各种帖子，几乎所有帖子都与文件路径错误有关。我只有一个目录来存放所有文件，所以没有 /img/ 或 /css/ 子目录。

希望有人能帮助我。

css

2 个回答

  1. Best Answer

    听起来这张图片可能存在一些问题，尽管其他图片运行正常。以下是需要检查的几件事：

    • 文件问题：直接在 Safari 中打开图片，确保图片未损坏。尝试从 Photoshop 或 GIMP 等编辑器重新导出图片。
    • 缓存：Safari 可能正在缓存图片。请尝试清除缓存或将 ?v=1 添加到图片 URL。
    • 文件大小/尺寸：较大的图像可能会导致问题。请尝试减小文件大小或尺寸，然后再次测试。
    • 文件权限：确保图像文件在您的服务器上具有正确的权限（例如 644）。
    • MIME 类型：仔细检查 Apache 服务器是否提供正确的 MIME 类型 (image/jpeg 或 image/png)。
    • 在其他设备上测试：查看图像是否可以在其他浏览器或设备上加载，以排除 Safari 特定的问题。

    总是将一些小链接放在你的问题中，以获得更好的答案。

    • 1

  2. 我找到了。服务器上不存在该文件，因此出现 403。这是因为它从未上传过！太愚蠢了。感谢 Akshay Kumar。

    • 0

相关问题