JSFiddle - React, Tailwind, and code Playground

by tzuuu

HTML

<! DOCTYPE html>
  <html lang="zh-TW">

    <head>
      <title>線上下單</title>
      <meta charset="utf-8" />
    </head>

    <body>
      <h1> 線上下單 </h1>
      <button onClick="order()">我要訂購</button>
      <button onClick="info()">認識工廠</button>
    </body>

CSS

h1{
  border: 5px;
  margin: 5px;
  padding: 5px;
}
button {
  border: 10px;
  border-radius: 10px;
  margin: 10px;
  padding: 5px 10px;
  background-color: #ADC2B5;
}

button:hover {
  font-weight: bold;
  cursor: pointer;
  border: 3px solid black
}

JavaScript

function order(){
	alert('謝謝您對我們的衣服有興趣！請致電 0987-654-321，會有專人提供您報價！')
}
function info(){
	alert('我們工廠位於新北市，通過國際 ISO9001 認證，品質讓您放心！')
}