Question

我有一个HTML元素textarea，具有定义的CSS规则{ resize: both }。在FF中，当用户将鼠标悬停在textarea的右下角时，光标会根据属性resize的值进行更改，但在Chrome中，光标不会更改。

请在FF和Chrome中打开this example，以检查差异。

这是Google Chrome的错误，我可以用CSS修复吗？

更新

Answer 1

实际上，至少有一些方法可以设置调整大小样式并在悬停时添加cursor: se-resize;。看看这篇文章：Can I style the resize grabber of textarea?

它描述了如何使用::-webkit-resizer来设置调整大小的样式：

::-webkit-resizer {
    border: 2px solid black;
    background: red;
    box-shadow: 0 0 5px 5px blue;
    outline: 2px solid yellow;
}

不幸的是，它停止了在Chrome中的运行，但我无法执行任何操作。（我认为它仍然可以在Safari中使用。）

但不要担心，创建自定义句柄并不难。实际上，我鼓励您使用自定义的，因为默认值太小且很难被使用。特别是触摸。实际上，有很多网站使用自定义手柄（或至少基于自动调整大小的网站，该网站会根据内容而增长。触摸效果也很好！）。

即。 Stackoverflow使用自定义句柄（TextAreaResizer）：

也有很多用于此目的的库，只需执行Google搜索，您就会发现一些适合您的内容：）

Answer 2

这是由浏览器本身渲染的，无法使用CSS设计