สร้างButton โดยใช้ CSS ปรับแต่ง

ที่ไฟล์ PHP

<style type="text/css">
body
{
font-family:"Tahoma", Arial, sans-serif;
}
input{
font-family:"Tahoma", Arial, sans-serif;
}
.css_button
{
border:#658A33 solid 3px;
background-color:#97CD39;
color:#000;
font-size:14px;
padding:4px

}

.pink_button{
border:#fdd6d9 solid 4px;
background-color:#fff;
color:#b94d30;
font-size:14px;
font-weight:bold;

height:40px;
-moz-border-radius: 3px; -webkit-border-radius: 3px;
}

.green_button{
border:#d8e2bd solid 4px;
background-color:#fff;
color:#819c2b;
font-size:14px;
font-weight:bold;

height:40px;
-moz-border-radius: 3px; -webkit-border-radius: 3px;
}
.blue_button{
border:#399bc9 solid 4px;
background-color:#368bbc;
color:#fff;
font-size:14px;
font-weight:bold;

height:40px;

}
.black_button{
border:#000 solid 4px;
background-color:#000;
color:#fff;
font-size:14px;
font-weight:bold;
height:40px;
-moz-border-radius: 5px; -webkit-border-radius: 5px;
}
.login_button{
border:#dedede solid 2px;
background-color:#f5f5f5;
color:#819215;
font-size:14px;

height:30px;
-moz-border-radius: 5px; -webkit-border-radius: 5px;
}
.cancel_button{
border:#dedede solid 2px;
background-color:#f5f5f5;
color:#d12f19;
font-size:14px;

height:30px;
-moz-border-radius: 5px; -webkit-border-radius: 5px;
}
.cange_button{
border:#dedede solid 2px;
background-color:#f5f5f5;
color:#000;
font-size:14px;

height:30px;
-moz-border-radius: 5px; -webkit-border-radius: 5px;
}
.down_button{
border:#285694 solid 2px;
background-color:#285694;
color:#fff;
font-size:14px;

height:30px;
-moz-border-radius: 9px; -webkit-border-radius: 9px;
}
</style>

เรียกใช้โดย เพิ่ม class = "" ที่ต้องการใช้ เช่น

<input type="submit" value=" Try this " class="blue_button" />



ที่มา http://pgm-lesson.blogspot.com/2011/11/button-css.html

         

  

Save Now