CSS：在旋转文本中旋转字母？

我在页面底部有一个旋转句子悬停的“由Coindesk提供支持”。CSS：在旋转文本中旋转字母？

我把跨度周围的字母，所以我可以单独样式。

我想向字母P中添加另一个微调控件类，以获得旋转文本中的旋转字母。

.spinner:hover { 
    animation-play-state: running; 
    animation-duration: 5s; 
    animation-iteration-count:10; 
    animation-delay: 0s; 
    cursor:crosshair; 
}

我可以将模糊类添加到跨度，但添加微调器不会改变任何东西。我是否已经达到了CSS的极限，或者有什么我可以尝试的，不会紧张？谢谢。

来源

2016-06-29 RubyRube

P.S.包含大量代码片段还是让人们阅读Codepen是最佳做法？ – RubyRube

你怎么能悬停在这个速度旋转的字母“p”？它只是用于测试吗？ –

是的，格林先生很棘手。也许用户可以悬停在P上，这会触发文本旋转+同时旋转单个字母。他们会看到P开始移动，文本。如果我需要，我可以减慢动画速度。我不知道开始谷歌搜索是什么主题，是嵌套？ – RubyRube

span是内联元素，并且变换不适用于它们。

将范围的显示属性更改为inline-block，它将起作用。

span.spinner { 
    display: inline-block; 
}

来源

2016-06-29 12:36:40 beercohol

这工作。在主文本停止旋转后，单个字母实际上会触发*。它看起来不错，但我会寻找一个属性，我现在可以按照设定的顺序触发事件。谢谢。 – RubyRube

CSS：在旋转文本中旋转字母？

回答

相关问题