輸入按鈕使用滑動門CSS

專門爲輸入按鈕如<input type="submit" value="Button Name">設計，此圓形鍵式使用該真實從單個圖像組裝sliding doors技術。輸入按鈕使用滑動門CSS

演示：Click to review the source code and demo the code in action
演示：Click to see a video demo of the style in Mac browsers: Firefox, Safari, Chrome and Opera

此按鈕樣式啓用以下：

解析寬按鈕問題爲IE瀏覽器長期按鈕名稱。
解決與IE瀏覽器的一個問題，當右滑門片會漂浮在頁面上，當按鈕被隱藏服務器端。
向下滾動時再備份頁面解析爲IE瀏覽器零散的文本問題。
這是設計師的完美替代品，當你不能使用的ASP 淨按鈕控件，如 <asp:Button id="b1" Text="Submit" runat="server" />在你的代碼
交叉兼容 Safari瀏覽器，IE，火狐，Chrome和歌劇。 watch video

來源

2010-06-29 Evan

我想你只需要改變一個僞類。

span.button input.form_button:hover { 
    background-position:left -39px; 
    color:#FFFFFF; 
}

應該

span.button:hover input.form_button { 
    background-position:left -39px; 
    color:#FFFFFF; 
}

編輯：這是行的演示源

來源

2010-06-29 14:01:42

你解決了它的52！另外，我根據你的建議添加了這個，所以當點擊右端時，它也會正確地激活左側。謝謝瑞恩！我現在有一個完成的按鈕！ span.button：活性input.form_button { 背景位置：左-78px; color：#FFFFFF; } – Evan 2010-06-29 14:06:39

總是很高興提供幫助！ – 2010-06-29 14:11:23

輸入按鈕使用滑動門CSS

回答

相關問題