CSS转换:悬停时的第一个字母

时间:2012-10-19 20:46:00

标签: css css-transitions

我正在使用:first-letter来定位带有某些样式的徽标中的第一个字母。悬停时,这封信的颜色会发生变化。

如何通过CSS过渡使这种颜色淡入?将过渡属性添加到我的任何选择器似乎都不起作用。

小提琴:http://jsfiddle.net/alecrust/YCMMZ/

编辑:显然Firefox 4+是唯一支持转换伪元素的浏览器,但是即使在那个浏览器中我也无法使上面的小提琴工作。

1 个答案:

答案 0 :(得分:5)

由于浏览器支持不佳,解决此问题的最佳方法是在一个范围内包装您的第一个字母并为该范围提供一个类。

<header class="header">
    <h1 class="logo">
        <a href="index.html"><span class="transition">E</span>xample</a>
    </h1>
</header>​

我在这里更新了你的jsfiddle来演示: http://jsfiddle.net/YCMMZ/3/