SOURCE

<div class="clip">
  background-clip 规定背景的绘制区域，默认背景绘制边框之内，值为border-box。
  <br />
  padding-box表示绘制padding以内。
  <br />
  content-box表示绘制在内容。
  <br />
  https://developer.mozilla.org/zh-CN/docs/Web/CSS/background-clip
</div>

body {
  background: url('http://csssecrets.io/images/stone-art.jpg');
}

.clip {
  border: 10px solid hsla(0, 0%, 100%, .5);/*这里第2 3 个值有百分号*/
  background: #fff;
  -background-clip: content-box;
  background-clip: padding-box;
  padding: 2em;
}