cursor:指针内部或外部:悬停

时间:2017-07-19 20:54:54

标签: css

我有以下2个css选择器:

.foo {
  cursor: pointer;
}

.foo:hover {
  cursor:pointer;
}

它们都具有相同的功能(我猜),但它们之间是否有任何性能差异?哪一个更优雅"优雅"使用?

2 个答案:

答案 0 :(得分:1)

Mozilla Developer Network - Documentation

上述链接文档指出了:hover伪类的一些 不优雅的 问题。

  

注意:hover伪类会在触摸屏上出现主要问题。根据浏览器的不同,:hover伪类可能永远不匹配,在触摸元素后仅匹配片刻,或者在用户停止触摸后直到用户触摸另一个元素时继续匹配。 Web开发人员应确保在具有有限或不存在的悬停功能的设备上可以访问内容。

  

在IE8-11中,将鼠标悬停在元素上然后向上/向下滚动而不移动指针将使元素保持:hover状态,直到指针移动为止。请参阅IE bug 926665

  

在IE9中(可能更早),如果<table>的父级具有非自动widthoverflow-x: auto;,并且<table>具有足够的水平内容溢出其父级,并在表格中的元素上设置:hover个样式,然后将鼠标悬停在所述元素上将导致<table>的{​​{1}}增加。

  

从适用于iOS 7.1.2的Safari Mobile开始,点击可点击元素会导致元素进入height状态。元素将保持:hover状态,直到另一个元素进入:hover状态。

而且,根据sitepoint.com

  

...用户可以通过激活:hover效果...

来触发回流

虽然Google's Developer Article on Minimizing browser reflow未明确提及:hover,但它确实声明:

  

有时回流文档中的单个元素可能需要回流其父元素以及其后的任何元素。

并且:

  

最小化CSS规则,并删除未使用的CSS规则。

     

如果您进行复杂的渲染更改(如动画),请执行此操作。 ...

     

避免使用不必要的复杂CSS选择器......

我的(有点受过教育的)意见

如果您不需要,请不要包含它。

答案 1 :(得分:0)

它是一样的。只是不要在normal stateimport string class SafeDict(dict): def __init__(self, missing='#', empty='', *args, **kwargs): super(SafeDict, self).__init__(*args, **kwargs) self.missing = missing self.empty = empty def __getitem__(self, item): return super(SafeDict, self).__getitem__(item) or self.empty def __missing__(self, key): return self.missing values = SafeDict(a=None, c=1}) string.Formatter().vformat('{a} {c} {d}', (), values) # ' 1 #' 中使用这两次,这是没用的。