javascript - iOS 11.2.5 上的文本区域插入符不旋转

Question

我有一个旋转 45 度的文本区域

textarea {
  transform: rotate(-45deg);
}

<textarea></textarea>

问题是在 iOS 设备上，文本插入符不会旋转，它显示为一个奇怪的大框。

textarea {
  border: 1em dashed red;
  padding: 1em;
  transform: rotate(-45deg);
}

<h2>
  Cursor in iOS: bugged
</h2>
<textarea></textarea>
<button>close keyboard</button>

CodePen 上的示例 https://codepen.io/brunolm/pen/eVBdaj

有什么解决办法吗？或者另一种旋转元素的方法？

Answer 1

您必须创建或添加自己的自定义光标，或者只是在 Google 上找到一个。

这个site很高兴找到一些自定义光标

textarea {
  border: 1em dashed red;
  padding: 1em;
  transform: rotate(-45deg);
  cursor: url(http://www.rw-designer.com/cursor-extern.php?id=77519), auto;
}

<h2>
  Cursor in iOS: bugged
</h2>
<textarea></textarea>
<button>close keyboard</button>