为什么背景图像显示在屏幕的一半？

我的背景图片没有覆盖我的网页上的所有内容，而只是应用了屏幕的一半。为什么背景图像显示在屏幕的一半？

具有相同图像的相同代码在我的另一页上正常工作。只有不同的是，我在这个页面上有很多内容，但我认为这并不重要。

问题在哪里？

在此先感谢。

HTML

<html> 

<head> 

</head> 

<body> 

<div id="main"> 
    <!--Here i have multiple sections--> 
</div> 
</body> 
</html>

CSS

#main { 
    position: relative; 
} 
#main:before { 
    content : ""; 
    display: block; 
    position: absolute; 
    top: 0; 
    left: 0; 
    background: url(../..//images/3.jpg) center center fixed; 
    width: 100%; 
    height: 100%; 
    opacity : 0.2; 
filter: alpha(opacity=20); 
    z-index: -1;

来源

2016-07-28 bc110402307 Syed Zeeshan Haide

你想在div添加背景图像或之前DIV？ –

我想在全我的网页或我所有内容的添加背景图片应该显示的图像 –

在你的意思是半个屏幕，或者，你可以你为什么要使用psudeo运营商只能看到一半的图像 –

试试这个代码

background-size:100% 100%;

来源

2016-07-28 06:42:01

我已经试过了.. –

body { margin：0px; 宽度：100％; 身高：100％; } #main { background-image：url（'download.jpg'）; 宽度：100％; 身高：100％; background-size：100％100％; background-repeat：no-repeat; } –

试试这个

background-image: url(path-to-file/img.jpg); 
background-repeat:no-repeat; 
background-position: center center;

来源

2016-07-28 06:43:53 sms

background-image：url（path-to-file/img.jpg）; background-position：center center; .... 我已经在我的问题中的这些代码行。再次看 –

他们不在那里 –

看到这个...背景：url（../..// images/3.jpg）center center fixed; –

嗨，你只是尝试用下面的CSS片段

background: url(../..//images/3.jpg); 
background-repeat:no-repeat; 
background-size:contain;

来源

2016-07-28 06:45:23 Sridhar

不工作亲爱的 –

background-大小：盖;它覆盖整个街区，图像无挤压;如果看不到完整的图像，请使用background-contain。 – Sridhar

我已经试过........ :( –

我猜你已经错过了双引号，而写你的ID。

<html> 
<head> 
</head> 
<body> 
<div id="main"> 
<!--Here i have multiple sections--> 
</div> 
</body> 
</html>

来源

2016-07-28 06:49:16 nam

问题有问题，而不是实际的代码 –

没有亲爱的，这是错过了错误... 看到我编辑的代码有问题 –

这种方法将工作

body 
{ 
margin:0px; 

width: 100%; 
    height: 100%; 

} 
#main { 
    background-image: url('download.jpg'); 
    width: 100%; 
    height: 100%; 
    background-size: 100% 100%; 
    background-repeat: no-repeat; 
}

来源

2016-07-28 07:05:44

在这里，您使用的是psudeo元素：前psudeo元素.The功能：之前如下。这将在第一index.In的情况下连接一个子节点您尝试股利前附加的图像element.And这并不符合你的整个身体。

为了适用形象，你的整个身体试试这个：

body 
{ 
margin:0px; 
width: 100%; 
height: 100%; 
background: url(../..//images/3.jpg) repeat left top; 
}

，并删除您psudeo元素：前

#main { 
    position: relative; 
    /*Other CSS Properties*/ 
}

来源

2016-07-28 07:19:21

为什么背景图像显示在屏幕的一半？

回答

相关问题