Odstranění tečkovaných okrajů u odkazů ^Doporučený

Grafikům, klientům a ani mě se tento efekt nelíbí. Jde přitom velice jednoduše odstranit. Ale i já na to zapomínám a většinou efekt na webu je a nikdo si jej ani nevšimne, protože při přechodu mezi stránkami je tento efekt prakticky neviditelný. Dobře jde vidět efekt při použití některého lightboxu - v tom případě totiž neodcházíte z webu, pouze se otevře lightbox a po jeho uzavření lze tento efekt pozorovat.

Odstranění efektu

Efekt lze jednoduše v základu odstranit jedním zápisem:

a {
   outline: 0;
}

Tuto část kódu často naleznete v různých CSS resetátorech. Slouží k odstranění efektu globálně.

Nezapomeňte na selectory

Kromě klasického :hover selektoru jsou v kaskádových stylech další selectory - :focus , :active . I tyto je dobré nastavovat. Osobně je nastavuji stejně jako hover efekt.

a:hover, a:active, a:focus {
  // nastylování efektu
}

Internet Explorer 9

Jak můžete tušit, Internet Explorer má svou specialitu - pokud v hlavičce máte uveden tento zápis, pak tečkovaný okraj nepůjde odstranit.

<meta http-equiv="X-UA-Compatible" content="IE=9" />