在HTML中如何写出正方形的盒子

在HTML中，如果你想将一个直角正方形通过JavaScript转换为圆角正方形，可以借助CSS的`border-radius`属性。首先，你需要创建一个直角正方形，通常通过设置宽度和高度相等，并且边框为0来实现。然后，你可以编写JavaScript代码动态地改变元素的`border-radius`值。 HTML部分： ```html <div id="square" style="width: 100px; height: 100px; border: none;"></div> ``` JavaScript部分： ```javascript // 获取DOM元素 var square = document.getElementById('square'); // 设置初始状态（例如，边框半径为0） square.style.borderRadius = '0'; // 当需要时，改变边框半径（这里设置为50%让所有角变为圆角） function makeRoundSquare() { square.style.borderRadius = '50%'; } // 调用函数，显示圆角正方形 makeRoundSquare(); ``` 在这个例子中，当你调用`makeRoundSquare()`函数时，`#square`元素就会从直角正方形变为圆角正方形。