获得点击 css :pseudo-elements答案

【问题标题】：Getting clicks on css :pseudo-elements获得点击 css :pseudo-elements
【发布时间】：2011-11-29 19:35:04
【问题描述】：

我正在尝试制作一个自定义复选框，所以我做了类似的东西：http://jsfiddle.net/wQdUn/2/

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

所以我有两个问题：

谢谢。

【问题讨论】：

【解决方案1】：

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

【讨论】：

Yup.
@thirtydot：这里的原始小提琴在 Chrome 或 Safari 中不起作用。我感觉 WebKit 有时会欺骗我们。
The original fiddle 适用于 Safari 5.0.3/Windows 7，但不适用于 Safari 5.1/Server 2008。我想我需要在我的实际计算机上更新 Safari，以便它可以正常中断。 .
感谢您的提示。愚蠢的 WebKit。

【解决方案2】：

对于那些从谷歌来到这个主题的人：

Safari 6.0.4(8536.29.13) 还是有这个问题，你需要在伪元素上设置inline-block才能让点击生效。

Chrome 的渲染引擎切换到 Blink，所以这个问题在 chrome 上不再发生（26.0.1410.65）。

【讨论】：