JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div_bg">
  <button class="order" onclick="order()">我要訂購</button>
  <button class="introduce" onclick="introduce()">認識工廠</button>
</div>

CSS

.div_bg{
  width:300px;
  height:50px;
  border-style:dashed;
  align-items: center;
  display: flex;
  justify-content:space-around;
}

.order{
  width:100px;
  height:30px;
  border-radius:10px;
  box-shadow: 0px 0px 2px 2px rgb(0,0,0);
  font-family:Microsoft JhengHei;
}

.introduce{
  width:100px;
  height:30px;
  border-radius:10px;
  box-shadow: 0px 0px 2px 2px rgb(0,0,0);
  font-family:Microsoft JhengHei;
}

.introduce:hover , .order:hover{
  box-shadow: 0px 0px 4px 4px rgb(0,0,0);
  background-color:lightpink;
  cursor: pointer;
}

JavaScript

function order(){
	alert('謝謝您對我們的衣服有興趣！請致電 0987-654-321，會有專人提供您報價!');
}

function introduce(){
	alert('我們工廠位於新北市，通過國際 ISO9001 認證，品質讓您放心！');
}