时间戳

首页 > 解决方案 > CSS中图像的文件路径

html - CSS中图像的文件路径

问题描述

我一直在尝试将图像保存在我的计算机上，并使用 CSS 将其设置为覆盖整个页面的背景图像。请帮忙。

html代码是这样的：

<div class="page-container">
<h1>HI</h1>
</div>

CSS代码是这样的：

.page-container {background-image: url(css/images/huelvapiersunset.jpg);
height: 100%;
}

这些文件的组织方式如下：

图像测试/css/图像

提前致谢！

标签： htmlcss

解决方案

为了使图像显示为具有所提供设置的背景，必须在styles.css.
1. background-image 中的 url 变成url('images/huelvapiersunset.jpg'). 此处添加了引号，'添加了css已删除的引号，因为该文件已在css文件夹中。
2. 高度等于所用图像的高度（以像素为单位）。
下面是一个工作示例的代码。

.page-container {
  background-image: url('images/huelvapiersunset.jpg');
  height: 1167px;
}

以及出现的带有文字的背景图像。

推荐阅读