CSSでボタンに影をつけ、クリック時に消す方法

CSSでボタンに影をつけ、クリック時に消す

sample.css

.btn {
  /*水平方向の影の長さ、垂直方向の長さ、影の色を指定*/
  box-shadow: 0px 7px #1a7940;
}

/*クリック時のイベントを指定*/
.btn:active {
  /*影をけす*/
  box-shadow: none;
  /*ボタンを下に移動させる＝ボタンがクリックされたように見える*/
  position: relative;
  top: 7px;
}