清除移動端網站點擊a標簽時閃現的邊框或遮罩層(CSS)


  在移動端網站,當你點擊加了a標簽的文字或圖片時,該元素的周圍會閃現一個藍色的邊框,在微信上的網站就是如此;而有的瀏覽器會閃現一個半透明遮罩層,比如移動端的Chrome瀏覽器,其實這些特效無非就是為了告訴用戶已點擊了該元素,提升用戶體驗,但有的時候你會覺得這些特效看起來很別扭,就想着清除它,其實這很簡單,只要加上一句CSS就行了。

  清除所有a標簽在點擊時出現的特效:a{ -webkit-tap-highlight-color:rgba(255,0,0,0);}

  這是webkit內核瀏覽器的私有屬性,但它對於微信上的網站同樣有效,估計微信用的瀏覽器也是webkit內核的,其實大部分移動端瀏覽器用的都是webkit內核,比如UC和Safari。

  提醒下,這句CSS只能清除a標簽點擊時出現的特效,而無法清除添加了JS點擊事件的元素出現的特效,其實這兩種點擊特效都是一樣的,要么給元素添加一個邊框,要么就是一個遮罩層。暫時還不知道如何清除后者的特效,望知道的大神留個言,謝謝了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM