2016-04-29 5 views
3

Как использовать селектор SASS в псевдоселекторе в режиме зависания? Желаю написать меньше кода и очистить его.SASS: после: селектор hover

Предпочтительный способ, не работает:

div { 
    a { 
     transition: all 0.25s ease-in-out; 
     &:after { 
      content: ">>"; 
      left: 10px; 
      :hover & { 
       left: 10px; 
      } 
     } 
    } 
} 

В противоположность:

div { 
    a { 
     transition: all 0.25s ease-in-out; 
     &:after { 
      content: ">>"; 
      left: 10px; 
     } 
     &:hover { 
      &:after { 
       left: 10px; 
      } 
     } 
    } 
} 
+0

': hover &' target': hover' * inside * of ': after', а не на нем, не так ли? – TylerH

+0

В первом примере это так. Попытка захватить внешний родительский элемент как селектор. –

+0

Вы даже * посмотрели * на скомпилированном выходе? Когда есть только один возможный порядок селекторов, который будет работать, вам нужно написать селектора в этом порядке. Никакое количество желаний ничего не изменит. – cimmanon

ответ

5

Использование &:hover:after {} для ориентации на after псевдо-элемент элемента, завис над.

&:after:hover {} будет выбирать псевдоэлемент after и использовать его для зависания.

+1

Это, наверное, так же чисто, как я могу это получить, я полагаю. Неплохо. –

Смежные вопросы