: zaměření - Triky CSS

Anonim

Třída :focuspseudo v CSS se používá pro styling prvku, který je aktuálně cílen klávesnicí nebo aktivován myší. Zde je příklad:

textarea:focus ( background: pink; )

Jakýkoli prvek (nejčastěji s a s) je „zaostřen“, když je vybrán a je připraven k zadání textu (například když bliká kurzor). Uživatelé myši na ně mohou kliknout (nebo na související label), aby se mohli soustředit, a uživatelé klávesnice do nich TAB.

„Tabbing“

další použití :focuspseudotřídy je „procházení tabulkami“ mezi prvky. Mnoho prohlížečů má výchozí stav fokusu pro výběr karty, což je tečkovaný obrys. Je poměrně snadné jej odstranit, ale pokud ano, nahraďte jej vhodnou alternativou.

s, s, sa textareas všichni mají :focus stát ve výchozím nastavení, ale můžete dát stav zaostření jakéhokoli prvku HTML. Jak contenteditable a tabindex atributy práci pro to, jak je v tomto příkladu:

Příbuzný

Článek 12. května 2017

Pseudo třída `: focus-within`

Chris Coyier

Podpora prohlížeče

Všechny prohlížeče podporují základní použití :focus.