如何将计算机目录中的图像作为CSS / HTML中的背景图像引用

Question

我正在使用HTML页面在visual studio 2012中设计一个网页。我想从我的计算机目录上传图像。目前正在从URL中获取它。

Answer 1

很简单。

我们这样做：

1. 创建一个名为“myWebsite”
的文件夹
2. 在'myWebsite'文件夹中放置所有html文件
3. 在'myWebsite'文件夹中创建另一个名为'images'的文件夹
4. 在'images'里面放置你的图像。让我们为你的形象命名 - sampleImage.jpg
5. 在'myWebsite'文件夹中创建另一个名为'css'的文件夹并将您的css文件放在那里

现在在你的CSS文件中执行以下操作：

body{
    background-image:url('../images/sampleImage.jpg');
}

尝试一下，如果你明白了，请告诉我。

Answer 2

您需要引用相对于您网页的图片。例如，如果您的网站是在一个名为public_html的文件夹中构建的，并且您的图片位于index.html上，并且您在public_html中将名为example.jpg的图像放在名为img的文件夹中，则可以参考来自index.html的图像具有以下内容：

<img src="img/example.jpg" alt="" />

出于安全考虑，您无法引用本地图像，需要将其上传到某处。假设您将图像上传到example.com的根目录，您可以将src更改为“http://www.example.com/example.jpg”

由于您希望将它作为背景图像，因此您应该使用一些css，例如：

body {background:url('img/example.jpg') repeat;}