Применить стиль курсора курсора к элементу или его: hover

Question

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

Метод 1:

.element { 
    cursor: pointer; 
} 

Метод 2:

.element:hover { 
    cursor: pointer; 
} 

Оба будут делать то же самое - изменить курсор указателя при наведении .element. Но есть ли разница между этими двумя методами? Будет ли это иметь влияние на браузер (т. Е. Производительность) при использовании метода 1 вместо метода 2? Мне просто интересно.

Answer 1

Нет никакой реальной разницы. Я бы поставил стиль в том, где он выглядит стилистически. В следующем примере имеет смысл иметь cursor:pointer в части :hover, так как .clickable имеет только стиль по-разному (то есть имеет синий фон) при наведении. В противном случае я предлагаю использовать его в обычном селекторе .clickable.

HTML:

<span class="green-bg">Span 1</span> 
<span class="green-bg clickable">Span 2</span> 
<span class="green-bg">Span 3</span> 

CSS:

.green-bg { 
    background: green; 
} 
.clickable:hover { 
    background: blue; 
    cursor: pointer; 
}