CSS 如何为背景图片添加边距？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4694191/
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
How do I add margin to just background image?
提问by lisovaccaro
I want to add a margin to the background image so that I distance it from the middle of the screen, but adding it inside that class adds a margin to the whole body.
我想为背景图像添加一个边距，以便我将它与屏幕中间分开，但是在该类中添加它会为整个身体添加一个边距。
body.poppage {
background: url(/Imagenes/tip3.png) 50% 200px no-repeat #E2E4E9;
}
How could I do it? Thanks
我怎么能做到？谢谢
采纳答案by shankhan
you can use the background-positionproperty
您可以使用background-position属性
回答by The Demz
Use the containers padding to make a kind of margin for the background.
使用容器填充为背景制作一种边距。
<div class="thebox">
<p>HEY!</p>
</div>
div.thebox
{
box-sizing: border-box;
width:400px;
height:400px;
border: 2px solid #000000;
padding: 10px;
background: url(http://studio-creator.com/blog/public/html5.jpg) center;
background-size: contain;
background-repeat: no-repeat;
background-origin: content-box;
}
回答by GIN TOKI
this work with me i have 50px navbar
和我一起工作，我有 50 像素的导航栏
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: 0 50px !important;
回答by Wazy
You might want to try something else... like moving the image to the next child. You can make a wrapper div around your fixed-width div to accomplish this task.
您可能想尝试其他方法……例如将图像移动到下一个孩子。您可以在固定宽度的 div 周围制作一个包装 div 来完成此任务。
回答by parisminton
You can't really add margins to a background image, since it's not actually an element. A couple things you might try:
您不能真正为背景图像添加边距，因为它实际上不是一个元素。您可以尝试以下几件事：
If you've got a containing element just inside the body, you can apply the background image to this element and set margins on it.
If all you want is to make the background image appear to be floating within its container, set its background position.
如果您在主体内部有一个包含元素，则可以将背景图像应用于该元素并在其上设置边距。
如果您只想使背景图像看起来在其容器内浮动，请设置其背景位置。
