還不錯(cuò)哦。實(shí)際上,根據(jù)W3C的定義,<button>元素就是為了解決這些表現(xiàn)上的差異才應(yīng)運(yùn)而生的。
Buttons created with the BUTTON element function just like buttons created with the INPUT element, but they offer richer rendering possibilities: the BUTTON element may have content. For example, a BUTTON element that contains an image functions like and may resemble an INPUT element whose type is set to “image”, but the BUTTON element type allows content. The Button Element - W3C
因此我們要為此尋找一個(gè)設(shè)計(jì)方案,好在擁有海量資料的互聯(lián)網(wǎng)可以為我們提供一些有用的幫助來解決這個(gè)問題。這的確很方便,但是不幸的是很設(shè)計(jì)者和網(wǎng)站開發(fā)者甚至都不知道這個(gè)元素的存在。在我決定用button元素替換掉Wufoo(本文作者的一款網(wǎng)絡(luò)產(chǎn)品,dudo注)前,我得肯定這個(gè)標(biāo)簽和CSS能滿足以下的需求:
需求條件: 1、他們必須具有按鈕的外觀 2、在不同瀏覽器中有相同的表現(xiàn)樣式 3、button中所應(yīng)用的樣式同樣可以在超級(jí)鏈接上使用(因?yàn)閃ufoo中的交互總是使用表單提交的方式和鏈接觸發(fā)Ajax的方式中的某一個(gè)實(shí)現(xiàn)的,他們可能經(jīng)常會(huì)緊挨在一起,因此我需要他們具有相同的表現(xiàn)樣式) 4、在不同的情況下標(biāo)簽?zāi)軌虮憩F(xiàn)靈活,易于修改 5、對(duì)于信息傳遞過程中發(fā)生的事件能夠用圖標(biāo)和顏色有效地區(qū)分
面對(duì)上面的問題,我首先寫出一些CSS來,然后再解決跨瀏覽器的問題。接下來我們就會(huì)看到: 最終結(jié)果