点击css：pseudo-elements

Question

我正在尝试制作自定义复选框，因此我做了类似的事情：http://jsfiddle.net/wQdUn/2/

问题在于，在基于WebKit的浏览器上，只有在单击<span>的内容时才会切换复选框，而不是在框本身上，而在Firefox中我会得到我期望的行为。

所以我有两个问题：

• 哪一个正确行为（即符合规范的行为）？
• 如何在两种浏览器（以及其他浏览器......）中获得我想要的结果？

感谢。

Answer 1

不确定第一个问题，但是如果你也将span作为内联块，它将在WebKit浏览器中按预期工作。见http://jsfiddle.net/wQdUn/5

Answer 2

对于那些来这个主题的人来说，google：

Safari 6.0.4（8536.29.13）仍然遇到此问题，您需要在伪元素上设置inline-block以使点击工作。

Chrome已切换为Blink作为其渲染引擎，因此此问题在Chrome上不再发生（26.0.1410.65）。