翻转箭头字符



你好,我找到了我喜欢的这个箭头➣➣,我试图得到这个箭头的相反方向,但似乎找不到。我注意到当我在此页面上找到它时:http://character-code.com/arrows-html-codes.php 列出了一个附加代码(➣),但是当我需要左箭头时,这只是相同的右箭头。

这个

左箭头不存在吗?

<span>&#10147;</span>
span {
  transform: rotate(180deg);
  display: inline-block;
}

这不提供相反的 unicode 箭头。它将原始箭头旋转 180 度。

更好的是水平翻转箭头。这个CSS应该这样做。

transform: scale(-1);
filter: flipH;
-ms-filter: flipH;

span.rotate {
  transform: rotate(180deg);
  display: inline-block;
}
div.flipped {
  display: inline-block;
  -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>Rotated
  <span class="rotate">&#10147;</span>
</div>
<div>Flipped
  <div class="flipped">&#10147;</div>
</div>

没有对应于 U+27A3 的相反方向字符 三维底部向右箭头。一个充分的证据是,如果你在Unicode字符数据库中搜索,例如使用BabelMap,寻找名称包含THREE-D的字符,你只会找到U + 27A3和U + 27A2 THREE-D顶部向右发光的箭头。如果有相应的 leftwards 字符,实际上可以肯定它的名称是相似的,只是 RIGHTWARDS 被 LEFTWARDS 取代。

@Mouser提出了很好的解决方法,但我认为提出的问题也值得回答。

最新更新