Question

出于某种原因，当我在span内放置一个小写的J字符时，它会切断尾部。您可以通过更改悬停时的字体颜色轻松查看。我在OSX和Safari 7.0.1上的Chrome 32中对此进行了测试。

HTML

<body>
    <span>j</span>
</body>

CSS

body {
    font-size:30em;
    text-align:center;
}
span:hover {
    color:red;
}

为什么会发生这种情况，我该怎么做才能解决它？

Answer 1

这是因为span是内联元素;为什么它只在:hover上进行，我不知道。我无法通过快速搜索找到任何内容，因此我只能猜测文本的那一部分可能位于span之外且:hover不会扩展到元素之外。

你可以做一些事情来解决这个问题：