使用两行 CSS 重新调整任何 DOM 元素的大小

我最近看了一个视频，视频中演示了如何使用两行 CSS 调整任何 DOM 元素的大小。

因此，要使任何 DOM 元素可调整大小，你可以向其中添加以下 CSS。

div {
  resize: auto;
  overflow: auto;
}

resize 属性允许你指定元素是否可由用户调整大小，overflow 属性可确保元素内的内容在超过元素大小时可以滚动。

你还可以通过使用 horizontal、vertical 或者 both 值将大小调整限制在特定方向。例如，如果你想只允许水平调整大小，你可以使用：

div {
  resize: horizontal;
  overflow: auto;
}

就是这样！我认为这是一个巧妙的小技巧，在各种场景中都很有用，尤其是在构建用户界面时，你想让用户能够动态调整某些元素的大小。

当你想在开发过程中验证某些元素的大小调整行为，而不想对宽度和高度属性进行太多修改时，这也很有帮助。