ปุ่มสวยด้วย CSS
<style type="text/css">
#button1 {
color:red; /* สีของตัวอักษร */
border:1px solid navy; /* กรอบของปุ่ม */
background-color:white; /* สีพื้นของปุ่ม */
font:8pt Tahoma; /* แบบอักษร */
padding:3px; /* ช่องว่างระหว่างกรอบกับตัวอักษร */
}
</style>
<input type="button" id="button1" value="แบบที่ 1." />
<style type="text/css">
#button2 {
color:red; /* สีของตัวอักษร */
border:1px solid navy; /* กรอบของปุ่ม */
background-color:white; /* สีพื้นของปุ่ม */
font:8pt Tahoma; /* แบบอักษร */
padding:3px; /* ช่องว่างระหว่างกรอบกับตัวอักษร */
background:url(home.gif); /* มีรูปด้วย */
background-position:center;
background-repeat:no-repeat;
}
</style>
<input type="button" id="button2" value="แบบที่ 2." />
<style type="text/css">
#button3 {
color:red; /* สีของตัวอักษร */
border:1px solid #666666; /* กรอบของปุ่ม */
background-color:white; /* สีพื้นของปุ่ม */
font:8pt Tahoma; /* แบบอักษร */
padding:3px; /* ช่องว่างระหว่างกรอบกับตัวอักษร */
background:url(background.gif); /* มีรูปเป็นพื้น */
}
</style>
<input type="button" id="button3" value="แบบที่ 3." />ตัวอย่าง