这个coDrops链接效果可以对<span>元素中的文本起作用吗?</span>

时间:2013-08-16 23:22:51

标签: css3 animation hover html pseudo-element

我正在尝试从段落文本中的单词http://tympanus.net/codrops/2013/08/06/creative-link-effects/模拟CSS动画。我绝对没有成功。我想知道是否不支持伪元素或他们使用它们的方式是错误的。我已经测试并确认元素支持悬停。我还在悬停时看到了一些关于CSS动画的例子。但我似乎无法让我的榜样发挥作用。

以下是codepen http://cdpn.io/bjGxl

上的代码

谢谢。

1 个答案:

答案 0 :(得分:1)

你的css中有一个额外的逗号

.highlight:hover::before,
.highlight:focus::before,{
    max-width: 100%;
}

应该是

.highlight:hover::before,
.highlight:focus::before{
    max-width: 100%;
}

.highlight:可以删除焦点,因为跨度无法聚焦。

http://cdpn.io/uEiKf