当鼠标悬停在框的边框上时如何获得“调整大小”类型的光标？

Question

我正在尝试将光标属性从 更改为:default仅将:se-resize鼠标悬停在框的边框上。有什么办法可以在 CSS 中做到这一点吗？我只需要CSS 中的选项！

HTML：

<textarea placeholder="..."></textarea>   

CSS：

textarea {
width: 510px;
height: 140px;
padding: 5px 0;
border:2px solid #dddddd;
outline-style:none;
color: #777777;

}

Answer 1

在这里，使用具有用于悬停的 CSS 的包装 DIV 来尝试此操作。

.border {
  background-color: red;
  cursor: e-resize;
  padding: 5px;
}

.contents {
  background-color: white;
  cursor: default;
  height: 100px;
  line-height: 100px;
  text-align: center;
}

<div class="border">
<div class="contents">
  Hello World
</div>
</div>

另外在这里： https: //jsfiddle.net/vyk4c21b/9/