CSS怎么寫(xiě)可隨時(shí)改變div大小

在CSS中，我們可以使用JavaScript來(lái)動(dòng)態(tài)改變div的大小，以下是一個(gè)簡(jiǎn)單的例子：

我們需要一個(gè)HTML div元素：

<div id="mydiv">Hello World!</div>

我們可以使用CSS來(lái)設(shè)置div的初始大?。?/p>

#mydiv {
  width: 200px;
  height: 200px;
  background-color: #f0f0f0;
  padding: 10px;
  border: 1px solid #000;
}

我們可以使用JavaScript來(lái)動(dòng)態(tài)改變div的大小，我們可以編寫(xiě)一個(gè)函數(shù)來(lái)將div的大小增加50像素：

function increaseSize() {
  var mydiv = document.getElementById('mydiv');
  mydiv.style.width = (mydiv.offsetWidth + 50) + 'px';
  mydiv.style.height = (mydiv.offsetHeight + 50) + 'px';
}

我們可以將這個(gè)函數(shù)綁定到一個(gè)按鈕上，以便在需要時(shí)調(diào)用它：

var button = document.createElement('button');
button.innerHTML = 'Increase Size';
button.onclick = increaseSize;
document.body.appendChild(button);

當(dāng)我們點(diǎn)擊按鈕時(shí)，div的大小會(huì)增加50像素，我們可以根據(jù)需要隨時(shí)調(diào)用這個(gè)函數(shù)，以動(dòng)態(tài)改變div的大小。