CSS3 - 动画文本对齐左/中/右 [英] CSS3 - animate text align left/center/right

问题描述

我在全宽div中有一行（未包装）文字。

I've got one line (not wrapped) text inside full width div.

可以为此元素添加动画文本对齐，所以文本移动到给定的边/中心 - 测量宽度和使用相对/绝对定位，但我没有找到它直接的解决方案，它也可能会导致一些响应的问题？

Is it possible to animate this element text alignment so text moves to given side/center - I know I could mensure width and use relative/absolute positioning, but I dont find it straight solution and it also may cause some responsive issues?

这里是没有动画的 演示 。

Here is demo without animations yet.

推荐答案

text-align 属性不可动，所以你不能使用css transition你的最佳镜头将是定位（使用百分比单位来保持响应）。

text-align property is not animatable, so you can't use it with css transition nor with jquery animate .. Your best shot would be the positioning (use percentage units to retain responsivity).

希望这有助于...

这篇关于CSS3 - 动画文本对齐左/中/右的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！