纯css实现div宽度可调整
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>纯css实现div尺寸可调整</title><style>.box {width: 100px;max-width: 600px;min-height: 200px;resize: both; /* 允许水平调整大小 */overflow: auto; /* 必须设置 overflow 为 auto 或 visible 才能调整大小 */position: relative;background-color: aliceblue;}/* .box::after {content: "";position: absolute;top: 0;right: 0;width: 10px;height: 100%;pointer-events: auto;cursor: ew-resize;z-index: 1;} */.box:hover::after {background-color: rgba(0, 0, 0, 0.1); /* 可选：添加背景色以便观察效果 */}</style></head><body><div class="box"></div></body>
</html>