Ако работите с CSS, знаете, че стиловете се прилагат към селекторите, които от своя страна съдържат HTML елементи. Но не винаги. Съществува фантомна класа от класове, която се среща само в определени състояния на обект. Например, бутон или избрано поле за въвеждане е натиснато. За такива специални случаи има CSS псевдокласи: focus ,: hover,: active.
Динамични псевдокласи
.бутон: hover {
border: 1px solid # 333;
}
.button: активна {
непрозрачност: .5;
}
В този пример, докато потребителят щракне върху показалеца на мишката върху елемента с бутона за класа, записите в стила: hover не се показват.
& lt; скрипт async = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
& lt ;! - fb_336x280_mid - & gt;
& lt; script & gt; (adsbygoogle = window.adsbygoogle || []). push ({});
& lt ;! - fb_336x280_mid - & gt;
& lt; script & gt; (adsbygoogle = window.adsbygoogle || []). push ({});
Традиционно псевдокласите се използват за обработка на връзки и бутони. Но диапазонът от възможности е много по-широк. CSS: фокусът се отнася до обекта на уеб страницата, която има фокуса на входа. Най-често това е формата на регистрация и търсене.
вход [type = "text"], вход [type = "email"] {
ширина: 300px;
семейство на шрифтовете: „Gochi Hand“, курсив;
text-align: center;
граница: 0;
контур: няма;
}
вход [type = "text"]: фокус, вход [type = "email"]: фокус {
граница: 0;
}
: hover е отговорен за елементите, върху които е разположен указателят на мишката или друго устройство. Когато потребител активира обект на страница, например кликне върху връзка, се появява псевдоклас: active