在 CSS 中，div是一個常用的標簽，可以用來組合各個 HTML 元素。這篇文章將討論如何通過 CSS 實現一個div的拖動變寬。

代碼示例：
拖動我變寬

首先，在 CSS 中設置div的樣式，包括寬度、高度和背景顏色等。要實現拖動變寬，還需要將cursor屬性設置為可拖動的樣式。

在 JavaScript 中，定義了三個事件：鼠標按下、鼠標移動、鼠標抬起。當鼠標按下 div 時，設置isResizing為 true，表示正在拖動。記錄下此時的鼠標位置lastDownX。當鼠標移動時，計算當前鼠標位置與上次記錄的位置的差值，然后將差值加到當前的寬度上。最后把新的寬度設置回 div 上，并更新lastDownX。當鼠標抬起時，設置isResizing為 false，表示拖動結束。

以上就是實現 div 拖動變寬的代碼。不難看出這段代碼的核心在于計算鼠標移動時的差值，并將它加到當前寬度上。通過這種方式可以實現像素級別的拖動操作。