a标签的点击问题

Question

            .tablebtn{
                display: inline-block;
                width: 100px;
                height: 100px;
                border-radius: 50%;
                background: #fff;
                margin: 10px 0;
                overflow: hidden;
            }

                  <a class="tablebtn" href="javascript:void(0)">
                      <br />
                      <span class="table_name">富贵</span>
                      <br />
                      <span class="table_number">001</span>
                  </a>

当我点击的时候如何不让这个a标签出现那个蓝色的框框 太丑了

Answer 1

-webkit-tap-highlight-color: transparent  
-webkit-appearance: none;

Answer 2

这个是浏览器的蓝色框框吧

Answer 3

outline:none

Answer 4

a,button,input{-webkit-tap-highlight-color:rgba(255,0,0,0);}