去除input的默認樣式以及IE的兼容性問題

input標簽的默認樣式帶有一個黑色的邊框以及激活狀態會有一個的邊框,如下:

input的默認樣式和激活狀態

在開發中,一般需要給輸入框添加一個背景的效果,這時可以使用:

border: 0;   //去除邊框

然后使用背景圖片添加效果,同時它的激活狀態產生的邊框,可能與背景不搭,可以使用:

outline: 0;    //去除激活狀態的邊框

注意: ** border: none;也就是可以的,但是在IE6,7下存在兼容性問題,none**表示無,瀏覽器解析時就不做渲染,也就不消耗內存。

解決input的兼容性問題:

  1. 清除border的默認樣式(border: 0;)
  2. 設置父元素的邊框或背景圖片
  3. 文本樣式的設置(字體、顏色、行高等)
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,796評論 1 92
  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,923評論 18 139
  • 瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補丁和內補丁不同問題癥狀:隨便寫幾個標簽,不加樣式控制的情況下,各自的m...
    追卓2018閱讀 1,388評論 0 2
  • 在HTML5規范中,我最喜歡的Web技術就是正迅速變得流行的WebSocket API。WebSocket提供了一...
    陽光嘚猴子閱讀 419評論 0 5
  • 這是我參加思維導圖武林計劃的第30副圖,主題為:電腦文件夾的整理。 中心圖:選擇電腦,比較明了 主干:根據電腦本有...
    鄭鄭老三閱讀 449評論 1 2