宽高可拖拽

}, });

.box { width: 100%; height: 100%; margin: 1% 0; overflow: hidden; box-shadow: -1px 9px 10px 3px rgb(0 0 0 / 11%); } /* 左侧div样式 */ .left { float: left; width: calc(32% - 10px); /* 左侧初始化宽度 */ height: 100%; background: #fff; } /* 拖拽区div样式 */ .resize { position: relative; top: 45%; float: left; width: 10px; height: 50px; margin-top: -10px; color: white; /* z-index: 99999; */ font-size: 32px; background-color: #d6d6d6; background-position: center; background-size: cover; border-radius: 5px; cursor: col-resize; } /* 拖拽区鼠标悬停样式 */ .resize:hover { color: #444; } /* 右侧div'样式 */ .mid { float: left; width: 68%; /* 右侧初始化宽度 */ height: 100%; background: #fff; box-shadow: -1px 4px 5px 3px rgb(0 0 0 / 11%); }