определяют псевдо класс и псевдо-элемент в одном элементе

Question

Мой вопрос очень прост, только то, что я пытаюсь сделать, это :hover, :after и :before, я хочу парить НФА после встраивать в тот же элемент, проверить мой CSS код: -

#sidebar .widget li a:before:hover, #sidebar .widget li a.active:before { 
    background-position: 65% 65.7%; 
} 

Здесь элемент имеет значок в :before, которые я CNT удалять или изменять, а также я хочу иметь эффект при наведении на него ...

Любое решение для этого, моя консоль не показать эффект зависания?

Answer 1

Интересный вопрос. Если вы можете показать нам рабочий пример, мы, вероятно, могли бы помочь.

Однако в теории нет ничего плохого в том, что вы пытаетесь сделать (хотя не всем браузерам это понравится: особенно IE8 и ниже).

Важно понимать, что здесь :hover является псевдо- класса, в то время как :before является псевдо- элемент.

Вот краткий отрывок из the standard (с благодаря this answer ранее на переполнение стека):

Псевдоклассы разрешены в любом месте селекторов, а псевдо-элементы могут быть добавлены только после последнего простого селектора селектор.

Ошибка, которую вы делаете, заключается в вашем синтаксисе: порядок, который вы добавляете.

Попробуйте вместо этого:

#sidebar .widget li a:hover:before, 
#sidebar .widget li a.active:before { 
    background-position: 65% 65.7%; 
} 

Что следует делать, как вы хотите. Однако это не даст вам большого кросс-браузерного покрытия, это не то, что реализовано всеми браузерами.

Лучше было бы:

• сброса :before элемент ни к чему (перезаписать стили вы не можете получить доступ);
• использовать вместо повторного фонового изображения вместо якоря (для отображения изображения) и отложить влево, чтобы дать отступы;
• Вы можете затем переключить фоновое изображение в любом удобном для вас режиме, используя :hover на якоре в вашем CSS.

Это даст вам гораздо лучшую совместимость с другими браузерами.