小编典典

您可以使用CSS来镜像/翻转文本吗?

css

是否可以使用CSS / CSS3镜像文本?

具体来说,我有这个剪刀char“✂”(✂),我想显示左指向右。


阅读 306

收藏
2020-05-16

共1个答案

小编典典

您可以使用CSS转换来实现此目的。水平翻转将涉及像这样缩放div:

-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);

垂直翻转会涉及到像这样缩放div:

-moz-transform: scale(1, -1);
-webkit-transform: scale(1, -1);
-o-transform: scale(1, -1);
-ms-transform: scale(1, -1);
transform: scale(1, -1);

演示:

span{ display: inline-block; margin:1em; }

.flip_H{ transform: scale(-1, 1); color:red; }

.flip_V{ transform: scale(1, -1); color:green; }


<span class='flip_H'>Demo text &#9986;</span>

<span class='flip_V'>Demo text &#9986;</span>
2020-05-16