How to disable the html button highlight color in mobile view-CodePudding

How to disable the html button highlight color in mobile view. Hope people will help me. the image

CodePudding user response：

You can use -webkit-tap-highlight-color: rgba(0,0,0,0); or -webkit-tap-highlight-color: transparent;
This will not work on Firefox for mobiles.

For more info, check this.

Update: You can try to fake this by adding styled active :active and focus :focus CSS states.
Be sure to change the background color to the default. I'm using blue so you can see how it behaves:

.link {
text-decoration:none;
  background: lightblue;
  border-radius: 20px;
  padding: 1rem 3rem;
  color: white;
  font-weight: 800;
}

.link:active {
  background: blue;
}

.link:focus {
  background: blue;
}

<a href="#" >Click Me!</a>

CodePudding user response：

You can add this in your css file,

-webkit-tap-highlight-color: transparent;