背景图片重复，无法编码停止

我需要在此页面中获取背景图片，以便只显示一次，不重复，居中显示，并且在页面下方显示约500px。我似乎无法正确编写代码。我知道这是像“背景图像：norepeat”，检查了WC3页面，它给了我一些东西，但它只是打破了图片，并没有表现出来。背景图片重复，无法编码停止

这里的CSS部分：

#wrapper { 
width: 700px; 
margin: 0 auto; 
background-color: #d7fdc9; 
padding-top: 20px; 
padding-bottom: 20px; 
background-image: url(../images/bkgd-image.gif); 
}

林不确定，如果你需要完整的HTML和CSS，所以我刚刚张贴的小珍闻，因为我无法想象，你需要更多。

如果你确实需要它，lmk和生病发布。泰！

来源

2014-10-28 Kyle Schmelzer

background: #d7fdc9 url(../images/bkgd-image.gif) no-repeat center 500px;

或很长的路要走

background-image: url(../images/bkgd-image.gif); 
background-repeat:no-repeat; 
background-position:center 500px; 
background-color:#d7fdc9;

，给你包装的高度，如果有没有什么。

来源

2014-10-28 04:45:24 chris

这样做了，谢谢克里斯！任何方式来保持图像滚动？我试过位置：固定;但是这会使整个包装都得到修复。 – 2014-10-28 05:32:53

'background-attachment：fixed;'修复你的背景图片 – Wavemaster 2014-10-28 09:20:08

使用background-repeat: no-repeat;代替background-image: norepeat

body { 
    background-image: url('paper.gif'); 
    background-repeat: no-repeat; 
}

了解更多关于财产上W3School：http://www.w3schools.com/cssref/pr_background-repeat.asp

来源

2014-10-28 04:44:53

其实，这是我从回忆类是，重复-Y。无论出于何种原因，它都不起作用。我知道这显然是我做的其他事情，而不是你的代码，因为我清楚地记得它是相同的。 – 2014-10-28 05:34:05

@KyleSchmelzer你是电脑世界的新手？我只是从'W3C'复制粘贴代码。它的理解是你需要使用'no-repeat'。 – 2014-10-28 06:17:07

是的，也许你写的是错误的，它是：

background-image:url('../images/bkgd-image.gif'); 
background-repeat:no-repeat;

来源

2014-10-28 04:45:46

Ty Chun，感谢回复！ – 2014-10-28 05:37:38

尝试插入background-repeat: no-repeat;到你的CSS。

如果你想创建整个页面的背景：试试这个

html { 
    background: url(images/bg.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

来源

2014-10-28 09:17:12 TheSmile

背景图片重复，无法编码停止

回答

相关问题