Dotted border around link?

问题:

After having read all dotted border questions possible, and not having found an answer, I write my question below.

How do i remove the dotted border around the div when i click on a link inside it?

This image shows the word "photography", which has a dotted border when clicked on.

The basics behind this is just a dropdown, that appears when that section is clicked on, which works absolutely fine, i just cannot stand that border, does my nut in.

Any ideas?

回答1:

That's the focus state. Try to add this:

a:focus {
  outline: none;
}

Or if that element isn't a real link, but for example just an li, make that

li:focus {
  outline: none;
}

回答2:

You can use below css property.

a, a:hover, a:active, a:focus {
    outline: 0;
}

Please read this article - https://css-tricks.com/removing-the-dotted-outline/ and http://www.outlinenone.com/ for more clarification