Display buttons with custom styles and functionality
by rayray0093
HTML
<fieldset>
<button class="button" onclick="orderFunction()">我要訂購</button>
<button class="button" onclick="aboutFunction()">關於我們</button>
</fieldset>
CSS
fieldset {
padding: 20px;
width: 200px;
height: auto;
border-radius: 5px;
border: 2px gold solid;
background-color: black;
text-align: center;
}
.button {
border: 2px solid gold;
border-radius: 5px;
color: white;
background-color: black;
padding: 10px;
font-family: Arial, Helvetica, sans-serif;
}
.button:hover {
background-color: gold;
color: black;
border-color: white;
}
JavaScript
function orderFunction () {
alert ('謝謝您對我們的衣服有興趣!請致電 0987-654-321,會有專人提供您報價!');
}
function aboutFunction () {
alert ('我們工廠位於新北市,通過國際 ISO9001 認證,品質讓您放心!');
}