首先我們先介紹HTML中的button標簽的樣式設置：

普通按鈕設置：

把input元素的type屬性設置為“button”，可以創(chuàng)建普通按鈕。按鈕上顯示的文本是value屬性的值，如果沒有提供value屬性，則只創(chuàng)建一個空按鈕。如：

 input type= button value= 立即購買 

效果很明顯，這是默認普通按鈕的設置。

默認情況下，在普通按鈕上點擊，是沒有任何反應的。因此，需要為普通按鈕注冊事件，并手動編寫相應的處理函數(shù)。假如希望單擊上述按鈕時，提交表單，則要為按鈕注冊onClick 事件。如：

 form name= buy action= form.html method= post  button quot;submitForm(buy) 立即購買 /button  /form 

現(xiàn)在點擊按鈕，就會觸發(fā)onClick事件，并調(diào)用事件處理函數(shù)submitForm(buy)，參數(shù)buy為待處理表單name屬性的值。如果希望點擊按鈕后提交表單，就可以在事件處理函數(shù)中調(diào)用form對象的submit()方法：

function submitForm(f) { f.submit(); }

這是一個默認情況的設置，現(xiàn)在我們來看看給html button標簽設置樣式：

給大家看一個完整的代碼實例：

 !doctype html  html  head  meta charset= utf-8  title PHP  /title  style .div { display: inline-block; padding: .3em .5em; background-image: linear-gradient(#ddd, #bbb); border: 1px solid rgba(0,0,0,.2); border-radius: .3em; box-shadow: 0 1px white inset; text-align: center; text-shadow: 0 1px 1px black; color:white; font-weight: bold;.div:active{ box-shadow: .05em .1em .2em rgba(0,0,0,.6) inset; border-color: rgba(0,0,0,.3); background: #bbb; /style  /head  body  div >
這個的效果如圖：
這個的效果是不是很明顯，比默認的時候好看多了，等到我們學到js的時候，我們還能用js的技術把這默認的按鈕設置的更加美觀。
好了，以上就是關于html button標簽的樣式設置，還有美化樣式的總結(想學更多就來PHP )，有問題的可以在下方提問。
【小編推薦】
html下拉菜單怎么做？html下拉菜單的代碼實例介紹
html單選按鈕默認選中怎么做？input標簽的單選按鈕用法實例
以上就是html button標簽的樣式怎么設置？html button標簽的樣式介紹的詳細內(nèi)容，html教程        
鄭重聲明：本文版權歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。