0

我最近一直在开发一个使用 CSS3 中一些较新的 3D 效果变换的微型站点。然而，我一直试图让分层变得有点太棘手，以便某些视错觉生效，这是导致许多头痛的原因......

一般来说，Chrome（但不是 Firefox，尚未尝试 Safari 或 IE）中存在这个问题，其中所有内容似乎都在屏幕上“呈现”适当，但是当我点击链接或突出显示其中一个中的某些文本时“棘手的分层”区域，我的光标变软了，我无法获得任何功能。我可以看到一切都很好，只是有一堵看不见的墙阻止了我的光标交互，如果这有助于解释的话。

如果不粘贴一英里长的实验代码，是否有人知道可能导致此问题的原因？我最好的猜测是 z-index 继承在某些时候出错了，但很难诊断......导致我的下一个问题是，是否有人知道任何分层诊断的好策略（工具在这里也很棒）！

我当然精通标准的开发人员工具/Firebug ...

多谢你们！

4

1 回答 1

1

好的，所以我解决了我的问题并提出了以下策略，以供将来在诊断分层问题时参考...

  1. 检查可能相互干扰的所有元素的谨慎 Z-Index 值。如有必要，重新订购它们，看看是否能解决问题。如果没有，请继续。
  2. 检查步骤 1 中所有元素的谨慎定位。确保在 CSS 标记中声明它们具有“位置：绝对”或“位置：相对”。不要依赖继承/默认值。绝对声明是关键。
  3. 检查您的“背面可见性”值。如果您的设置很复杂，很容易忘记什么是什么。

遵循这种模式最终为我做到了。我的问题原来是所有 3 个问题的组合，但在我按照上述步骤操作之前，它们并不一定会向我展示自己。

于 2012-05-13T23:31:22.827 回答