CSS3 background-origin 属性

CSS3 background-origin 属性

padding-box	背景图像相对于内边距框来定位。
border-box	背景图像相对于边框盒来定位。
content-box	背景图像相对于内容框来定位。

<style>
.back{
  background:url(naicha.jpg) no-repeat;
  background-size: cover;
  height:150px;
  width:200px;
  padding: 20px;
  border: 10px dashed #333;
  background-origin: border-box;
  margin:30px;
  float:left;
}

.back1{
  background:url(naicha.jpg) no-repeat;
  background-size: cover;
  height:150px;
  width:200px;
  padding: 20px;
  border: 10px dashed #333;
  background-origin: padding-box;
  margin:30px;
  float:left;
}

.back2{
  background:url(naicha.jpg) no-repeat;
  background-size: cover;
  height:150px;
  width:200px;
  padding: 20px;
  border: 10px dashed #333;
  background-clip: content-box;
  background-origin: content-box;
  margin:30px;
  float:left;
}
</style>
<div class="back"></div>
<div class="back1"></div>
<div class="back2"></div>