バックグラウンドイメージにマージンを追加するにはどうすればよいですか？

Question

バックグラウンド画像に余白を付けて画面の中央から遠ざけるようにしたいのですが、そのクラスの中に追加すると全身に余白が追加されます。

body.poppage { 
    background: url(/Imagenes/tip3.png) 50% 200px no-repeat #E2E4E9; 
} 

どうすればいいですか？おかげ

Answer 1

あなたは次の子に画像を移動するように...何かをしようとする場合がありますbackground-positionプロパティ

Answer 2

を使用することができます。この作業を行うには、固定幅のdivの周りにラッパーdivを作成することができます。

Answer 3

実際には要素ではないので、余白を背景画像に実際に追加することはできません。

1. をあなただけの体内に含む要素を持っていれば、あなたがこの要素に背景画像を適用し、その上にマージンを設定することができます。あなたが試すかもしれないカップルの事。

2. バックグラウンドイメージをコンテナ内に浮かせるようにしたい場合は、バックグラウンドの位置を設定します。

Answer 4

コンテナのパディングを使用して、バックグラウンドの余白を作成します。

<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; 
} 

https://jsfiddle.net/gann1pwm/