「フィルター：ドロップシャドウ」を介してHTMLにボタンを追加できます。以下に示す例：

体 {
  背景：＃76D7C4;
}

ボタン {
  テキスト変換：大文字;
  パディング：10px 20px;
  色：白;
  カーソル：ポインター;
  背景：透明;/*背景はありません！*/
  ボーダー：1px固体白。
  ボーダーラジウス：100px;
  
  位置：相対;/* 新しい */
}

ボタン：後{
  コンテンツ： "";
  位置：絶対;
  / *擬似エレメントをコンテナと同じサイズにする */
  左：0;
  右：0;
  上：0;
  下：0;
  / *ボーダープロパティを継承 */
  ボーダーラジウス：継承;
  国境：継承;
  / *シャドウでフィルターを適用 */
  フィルター：ドロップシャドウ（5px 5px 1px rgba（0、0、0、0.25））;
}
You can add a button in HTML via "filter: drop-shadow". Example shown below:

body {
  background: #76d7c4;
}

button {
  text-transform: uppercase;
  padding: 10px 20px;
  color: white;
  cursor: pointer;
  background: transparent; /* no background! */
  border: 1px solid white;
  border-radius: 100px;
  
  position: relative; /* new */
}

button:after {
  content: "";
  position: absolute;
  /* Making pseudoelement the same size as container */
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  /* Inheriting border properties */
  border-radius: inherit;
  border: inherit;
  /* Applying filter with shadow */
  filter: drop-shadow(5px 5px 1px rgba(0, 0, 0, 0.25));
}