图片背景 - 按钮

Question

如何在宽度为100％的按钮中插入背景？

   #test{
      position: relative;
      z-index:99; 
      margin-top: 20px;
      width: 100px;
      height: 100px;
      background-image: url(http://lorempixel.com/200/200);
      background-repeat: no-repeat;
    }


    <button id="test"></button>

https://jsfiddle.net/gislef/mdngm86q/

Answer 1

使用background-size：

#test {
  position: relative;
  z-index: 99;
  margin-top: 20px;
  width: 100px;
  height: 100px;
  background-image: url(http://lorempixel.com/200/200);
  background-repeat: no-repeat;
  background-size: 100%; /* or 100px or contain */
}

<button id="test"></button>