Html 想要将背景图片放在中间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7633585/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Want to position the background image in the middle
提问by Shehzad009
Hello on my login page I have a background image. Currently the image is centered but not centered the way I want it. I want it so the image is always centered in the middle of the screen. Curently, my image is centered but is positioned at the top of the page. The image need to be positioned in the middle of the screen, and kept centered.
你好，在我的登录页面上，我有一张背景图片。目前图像居中，但没有按照我想要的方式居中。我想要它，所以图像总是在屏幕中间居中。目前，我的图像居中但位于页面顶部。图像需要定位在屏幕的中间，并保持居中。
login.html
<body style="background-image: url({{MEDIA_URL}}/admin_media/img/admin/bigstock_Photo_Showing_Financial_Growth_1339836.jpg); background-position: 50% 50%; background-repeat:no-repeat;">
回答by sandeep
may be you have write like this :
可能你是这样写的：
background-position: center center;
EDIT:
编辑：
may be there problem with the bodybecause it not takes screen entire heightso if you want an image show in the center of the screen then write
可能有问题，body因为它不需要整个屏幕，height所以如果你想在屏幕中央显示图像，然后写
html,body{height:100%;}
body{
background:url(http://www.poster.net/van-gogh-vincent/van-gogh-vincent-sternennacht-2601013.jpg) no-repeat fixed center center;
}
check the example http://jsfiddle.net/sandeep/m2fZs/2/
回答by r0skar
Instead of continuing to post comments, I thought it might be smarter to create a new answer.
与其继续发表评论，我认为创建一个新答案可能更明智。
Would something like this demowork for you? (replace 'fixed' with 'scroll' , if you want the img to scroll up and down with the page)
像这个演示这样的东西对你有用吗？（如果您希望 img 随页面上下滚动，请将 'fixed' 替换为 'scroll' ）
回答by dodancs
try it like this:
像这样尝试：
#element {
background-attachment:fixed;
background-position:center;
}
this should work!
这应该工作！
