好久沒有處理過IE6下的兼容問題了，今天有朋友碰到過input[type="submit"]和button[type="submit"]在IE6-7下會(huì)出現(xiàn)黑邊，就算是你在樣式中重置了一個(gè)border屬性也是如此。真是蛋疼的很。后來經(jīng)過查找相關(guān)的資料，終于找到了解決方法，放上來與大家分享一下，這個(gè)問題有可能不只一個(gè)人會(huì)碰到。(^_^)

在介紹如何處理這個(gè)bug之間我們一起來回顧一下，在IE6-7下，input[type="submit"]和button[type="submit"]存在的問題還不僅是這個(gè)，常見的有：button在IE67下的寬度兼容問題、button的行高問題（各瀏覽器下解析不一樣）、button的outline問題，甚至submit在ios下也存在問題。這么多煩人的事，苦逼了前端人員。今天就在為大家增加一個(gè)問題的解決方案——如何去除IE67下按鈕的黑邊框

問題是這樣的，你的登錄表單中有一個(gè)登錄按鈕，當(dāng)?shù)卿洶粹o得到焦點(diǎn)，并且消失焦點(diǎn)后，登錄按鈕會(huì)有一個(gè)1px的黑色邊框，這樣直接影響了頁(yè)面的效果，但是這樣的問題是怎么來的，我也不知道（希望有知道朋友能幫忙解釋一下）。而且這樣的bug將出現(xiàn)在下面兩個(gè)元素上：

button按鈕使用了【type="submit"】會(huì)產(chǎn)生這樣的bug;input使用了【type="submit"】也會(huì)產(chǎn)生這樣的bug。

一起來看這個(gè)問題的截圖：

要解決這樣的bug最好的方法就是在button和input的標(biāo)簽外添加一個(gè)標(biāo)簽，然后將樣式寫在這個(gè)標(biāo)簽上，并且把button和input的默認(rèn)樣式都去除掉，相信不少同學(xué)是這樣使用的，簡(jiǎn)單了事。但有的情況下我們是無(wú)法為這兩個(gè)元素添加標(biāo)簽的，那么我們就需要?jiǎng)e的方法來解決。

正常的解決方案是沒了，只有使用濾鏡來解決：

發(fā)表評(píng)論 共有條評(píng)論 用戶名: 密碼: 驗(yàn)證碼: 匿名發(fā)表