立即點擊此按鈕! 提交 <button>

漂亮按鈕可以通過添加額外的 <span class="類名"> 來包含具有圖標的類，例如:
<button class="sexybutton"><span><span><span class="ok">提交</span></span></span></button>
<button class="sexybutton"><span><span><span class="cancel">取消</span></span></span></button>

上一個  <button class="sexybutton"><span><span><img src="images/icons/resultset_previous.webp" alt="" />向後</span></span></button>
下一個 <button class="sexybutton"><span><span>向前<img class="after" src="images/icons/resultset_next.webp" alt="" /></span></span></button>

 <button type="reset" class="sexybutton sexyicononly"><span><span><span class="add"></span></span></span></button>
 <button type="reset" class="sexybutton sexyicononly"><span><span><span class="search"></span></span></span></button>
 <button type="reset" class="sexybutton sexyicononly"><span><span><span class="prev"></span></span></span></button>
 <button type="reset" class="sexybutton sexyicononly"><span><span><span class="next"></span></span></span></button>

按鈕尺寸共有三種：普通(預設)、中等和大型。更改尺寸也很簡單，只需添加類 sexymedium 或 sexylarge 即可：

普通按鈕 <a class="sexybutton" href="javascript:;"><span><span>普通按鈕</span></span></a>
中等按鈕 <a class="sexybutton sexymedium" href="javascript:;"><span><span>中等按鈕</span></span></a>
大型按鈕 <a class="sexybutton sexylarge" href="javascript:;"><span><span>大型按鈕</span></span></a>

更改皮膚就像添加類屬性來指定皮膚一樣簡單：

橙色按鈕 <a class="sexybutton sexyorange" href="javascript:;"><span><span>橙色按鈕</span></span></a>
黃色按鈕 <a class="sexybutton sexyyellow" href="javascript:;"><span><span>黃色按鈕</span></span></a>
提交 <button class="sexybutton sexyorange"><span><span><span class="ok">提交</span></span></span></button>
取消 <button class="sexybutton sexyyellow"><span><span><span class="cancel">取消</span></span></span></button>
 <button class="sexybutton sexyyellow sexyicononly"><span><span><span class="search"></span></span></span></button>

有一種類名為 sexysimple 的替代皮膚，它提供無限數量的顏色變化，而不需要單獨的皮膚圖像。它使用大多數現代瀏覽器支持的高級 CSS3 屬性來建立有效且美觀的“按鈕”效果。即使在不支持這些高級 CSS 屬性的瀏覽器中（是的，我說的是 Internet Explorer），按鈕也能很好地降級並保持完整的功能。由於按鈕不使用皮膚圖像，因此它們不需要雙重嵌套 <span> 元素，但仍使用 <span> 用於加上圖標。

簡單按鈕 <button class="sexybutton sexysimple">簡單按鈕</button>
OK <button class="sexybutton sexysimple"><span class="ok">OK</span></button>
 <button class="sexybutton sexysimple sexyicononly"><span class="settings"></span></button>

黑色按鈕 <button class="sexybutton sexysimple sexyblack"><span class="ok">黑色按鈕</span></button>
洋紅按鈕 <button class="sexybutton sexysimple sexymagenta"><span class="ok">洋紅按鈕</span></button>
茶色按鈕 <button class="sexybutton sexysimple sexyteal"><span class="ok">茶色按鈕</span></button>
紅色按鈕 <button class="sexybutton sexysimple sexyred"><span class="ok">紅色按鈕</span></button>
橙色按鈕 <button class="sexybutton sexysimple sexyorange"><span class="ok">橙色按鈕</span></button>
綠色按鈕 <button class="sexybutton sexysimple sexygreen"><span class="ok">綠色按鈕</span></button>
藍色按鈕 <button class="sexybutton sexysimple sexyblue"><span class="ok">藍色按鈕</span></button>
紫色按鈕 <button class="sexybutton sexysimple sexypurple"><span class="ok">紫色按鈕</span></button>
粉紅按鈕 <button class="sexybutton sexysimple deeppink"><span class="ok">粉紅按鈕</span></button>
黃色按鈕 <button class="sexybutton sexysimple sexyyellow"><span class="ok">黃色按鈕</span></button>

小按鈕 <button type="reset" class="sexybutton sexysimple sexysmall">小按鈕</button>
一般按鈕 <button type="reset" class="sexybutton sexysimple">一般按鈕</button> 
大按鈕 <button type="reset" class="sexybutton sexysimple sexylarge">大按鈕</button>
稍大按鈕 <button type="reset" class="sexybutton sexysimple sexyxl">稍大按鈕</button>
超大按鈕 <button type="reset" class="sexybutton sexysimple sexyxxl">超大按鈕</button>
極大按鈕 <button type="reset" class="sexybutton sexysimple sexyxxxl">極大按鈕</button>

漂亮按鈕支持四種狀態：1、正常，2、懸停/聚焦（將鼠標懸停在按鈕上或使用選項卡選擇按鈕），3、活動（單擊並按住鼠標按鈕），4、已禁用（<button disabled="disabled">）

按我! <button class="sexybutton"><span><span><span class="ok">Click Me!</span></span></span></button>
禁用按鈕 <button class="sexybutton disabled" disabled="disabled"><span><span><span class="cancel">禁用按鈕</span></span></span></button>
禁用按鈕 <button class="sexybutton sexyorange disabled" disabled="disabled"><span><span><span class="cancel">禁用按鈕</span></span></span></button>
禁用按鈕 <button class="sexybutton sexyyellow disabled" disabled="disabled"><span><span><span class="cancel">禁用按鈕</span></span></span></button>
 <button class="sexybutton sexyyellow sexyicononly disabled" disabled="disabled"><span><span><span class="next"></span></span></span></button>
禁用按鈕 <button class="sexybutton sexysimple disabled" disabled="disabled"><span class="cancel">禁用按鈕</span></button>
禁用按鈕 <button class="sexybutton sexysimple sexymagenta disabled" disabled="disabled"><span class="cancel">禁用按鈕</span></button>
禁用按鈕 <button class="sexybutton sexysimple sexyteal disabled" disabled="disabled"><span class="cancel">禁用按鈕</span></button>
 <button class="sexybutton sexysimple sexyicononly disabled" disabled="disabled"><span class="next"></span></button>

由於 IE6 不允許您直接設置禁用按鈕的樣式，因此您應該向禁用元素添加 disabled 類。