background-size: background-position:

background-origin: background-clip:

画面の幅を変更(960px未満)すると違いがわかりやすいかもしれません。背景画像のサイズは 960px X 640px です。

<body>
  <div id="wrapper">
    <div id="sample"></div>
  </div>
</body>
wrapper {
  max-width: 960px;
  margin: 50px auto;
}
* {
  box-sizing: border-box;
}
#sample{
	width:100%;
	background-color:#ddd;
	background-position: left top;
  height: 400px;
	background-image: url(../images/css/css3_bg03.jpg);
	background-repeat:no-repeat;
  background-size: cover;
  color: #fff;
  padding: 20px;
  border: 20px solid hsla(220,82%,77%,0.3);
}