Question

我一直在做一个网站，我有一个问题，因为图像不想在屏幕上显示。但是，我已多次检查代码，这一切似乎都正确！并且图像也位于php文件的同一文件夹中。我真的不知道为什么会这样。你能帮帮我解决一下吗？谢谢！

这是代码：

<!DOCTYPE html>
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Josefin+Slab:400,700' rel='stylesheet' type='text/css'>
<style>
body{
    background-color: black;
    font-family: 'Josefin Slab', 'Myriad Pro', Arial, sans-serif;
    color:white;
    font-size:80px;
    text-align:center;
}
.container {
    width: 1000px;
}
.div1 {
    background-image: url("pic1.jpg");
}

</style>
</head>
<body>
<h1>Restaurant</h1>

<div class="container">
<div class="div1">
</div>
</div>
</body>
</html>

Answer 1

您的准则是正确的。您唯一需要做的就是在div中添加内容，例如

<div class="div1"><h2>Here is another caption</h2></div>

在h2区域会有您指定的背景图片。

Answer 2

.div1 {
height: 610px;
width: 100%;
background: url("https://images-contests.99static.com/FtR2bRSgATkGUAOWom3RW3FznWQ=/fit-in/900x675/99designs-contests-attachments/0/384/attachment_384160");
background-size: 100% 100%;
background-repeat: no-repeat;
}

如果您要在没有其他内容的div中使用背景图像来为其提供尺寸，则需要指定div的高度和宽度，以便图像显示。 https://jsfiddle.net/g5gL1ue7/

网站图片未显示CSS

2 个答案: