CSS-селектори та їх види

Псевдокласи – особливі селектори

Для посилань зазвичай використовуються спеціальні селектори CSS-стилів, які відображають різні їх стану: спокійне, у фокусі, активне, пройдену – вони називаються псевдоклассами. Псевдоклас для активного посилання, на який наведено курсор, пишеться так: «а:active». Далі йдуть якісь властивості, найчастіше змінюється фон або додається тінь. Якщо додати цю властивість для посилання та кликнути по ній, вона змінити свій колір на заданий. Ще один псевдоклас – hover показує, що посилання вже пройдена. Записується так: «a:hover».

Особливості станів active і focus

Active часто плутають з іншим станом – focus. Записується так: «a:focus» і позначає активну стан кнопки при роботі з клавіатури. Тобто, якщо використовувати клавішу ТАБУЛЯЦІЇ, активне посилання буде виділятися особливим кольором. Це властивість обов’язково потрібно використовувати, так як користуватися мишею для навігації по сайту можуть не всі користувачі. У деяких може бути слабкий зір або інші обмеження по здоров’ю, тому вони переміщуються по сторінці за допомогою клавіш або спеціальних пристосувань. Ігнорування стану кнопки у фокусі є великим мінусом для такого параметра в дизайні сайту, як доступність, і робить значний вплив на його відвідуваність особливою категорією користувачів. При звичайної навігації за допомогою мишки посилання стає одночасно активної і в фокусі. Тому при стилізації елементів важливо звертати увагу на це.