|
|
Интересные статьи
|
|
|
|
|
Всегда используйте :hover вместе с :focus 
Мне очень понравилась Пашина статья о псевдоклассах. =) Специально по такому случаю в закромах была недавняя заметка с 456bereastreet.
Качественная разработка сайта любой сложности. Компания ltd-studio.
Реализация правил для псевдокласса :hover без реализации :focus является наиболее частым недосмотром при проектировании стиля сайта. Серьезность проблем при таком недосмотре зависит от того, как вы определили поведение для состояния :hover.
Рассмотрим их в порядке возрастания серьезности. 1. Неряшливость
Если для :hover заданы простые правила, например, только изменение цвета текста, пренебрежение :focus не влечет за собой серьезных проблем. В этом случае при смене фокуса с помощью клавиатуры актуальный элемент просто никак не выделится. 2. Серьезные проблемы использования
Гораздо больше проблем вы получите, если зададите свойство outline равным 0 или значению none. Эта проблема сейчас набирает актуальность, т.к. сведение на нет эффекта outline довольно популярно.
В этом случае ссылки технически доступны, но это никак не подтверждено визуально. Разве что некоторые браузеры отображают в статусной строке текущее значение href сфокусированной ссылки. 3. Полная недосягаемость
Существуют методики, которые делают содержимое совершенно недоступным для пользователей устройств без поддержки мыши. В частности, когда :hover используется для раскрытия меню, и при этом не определена реакция на :focus. В этом случае меню будет недоступно, если у вас нет мышки. Epicfail. Фокус на :focus (и :active)
Все перечисленные проблемы решаются довольно просто: там же, где вы определяете правила для :hover, укажите и :focus. Для того, чтобы Internet Explorer версий 7 и ранее распознал правила, надо дописать псевдокласс :active. Пара слов о порядке перечисления псевдоклассов объявлении
Этот параграф — отдельная заметка. Все желающие могут ознакомиться с оригиналом статьи.
Для многих известно, что порядок объявления псевдоклассов правиле CSS имеет значение. На 456bereastreet предпочитают следующий порядок: :link, :visited, :hover, :focus, :active
Этот порядок основан на нескольких статьях Эрика Мейера. Одна из них содержит довольно забавные мнемоники, я привожу их ниже на языке оригинала: LoVe’s Hurts Fade Away; Luther Vandross Hits Fabulous Arpeggios; Lord Vader Hates Furry Animals; Lusty Vampires Hunger For Absinthe; Lord Voldemort Has Foul Ambitions. Небольшое лирическое
Если кто-то думает: «Э... а как же модульные сетки, все дела, Марк Болтон и все такое». Сетки — будут позже. Болтон... при всем к нему уважении, такое огромное количество воды мне попросту надоело переводить. Будет время, переведу. Прошу прощения за то, что не довел до конца. Но там уже какая-то художественная литература, так что сюда ее выкладывать нет никакого смысла. В ближайшем рассмотрении весь этот цикл был всего лишь рекламой его книги с одноименным названием. К сожалению, это западный мир. Бесплатно дают только стакан воды. Источник: http://vremenno.net
|
|
|
Псевдоклассы в CSS
Итак, как я уже сказал, веб-разработчики используют псевдоклассы в основном для задания стилей ссылок, например :link для непосещенной ссылки, :hover для ссылки при наведении, :active для нажатой и удерживаемой ссылки и :visited для посещенной |
|
|
|
|