去年年底，做完最后一個項目就可以開開心心回家，可是在測試階段，發現了不少bug，為了不影響回家時間，加班加點也要解決這些問題，這里算是工作回憶，也算是工作的一點小總結。
在ios4+和android2+系統，當手指觸摸屏幕a標簽鏈接或按鈕時，會產生不同的效果，對於ios點擊元素的時候，就會出現一個半透明的灰色背景；對於android則出現紅色的邊框。對這2個系統自帶的效果，這種體驗的意義無非為了告知用戶按鈕已經點擊到，帶來的價值是好的。可惜帶來了體驗的同時，也帶來了bug......
主要是在android手機的一個bug
使用css給模塊設置了opacity:0，控制該模塊隱藏，如果該模塊包含a標簽，其a標簽在android手機是可以被觸發的，而在iphone是不可以觸發。
下圖左圖為模塊一，當頁面內容未加載完成時，顯示該模塊；右圖為模塊二，當頁面內容完全加載成功后才顯示該模塊，模塊二通過設置了完全透明使其隱藏在模塊一的上一層級。
在android手機中，當處於模塊一狀態時，用戶觸摸到“查看按鈕”，a標簽的邊框顯示出來，這明顯不是我們要想要的體驗。
最后跟產品經理溝通后，針對android手機去除上圖的按鈕邊框，那么如何去除android手機自帶的按鈕邊框呢？
在搜索引擎中找到資料-webkit-tap-highlight-color可以去除邊框，如下圖：
排除誤解
網絡資料說這個屬性只用於iOS(iPhone和iPad)，其實是錯誤的，android手機大部分也是支持的，只是顯示效果不一樣，移動開發並不成熟，更多的還需要大家去實踐來辨別真偽- -
-webkit-tap-highlight-color用法
webkit內核的瀏覽器，當用戶點擊一個鏈接或者通過js定義的可點擊元素的時候，會出現一個半透明的灰色背景或者紅色的邊框。
如果想要禁用高亮，可設置顏色的alpha值為0，也就是屬性值的最后一位設置為0就可以去除背景或者邊框。
去除android鏈接觸摸時產生邊框的css代碼
a,button,input{-webkit-tap-highlight-color:rgba(255,0,0,0);}/* 1.去除android a/button/input標簽被點擊時產生的邊框 2.去除ios a標簽被點擊時產生的半透明灰色背景 */
ok~搞定