css中怎么设置盒子半圆

<style>
    .box {
      width: 200px;
      height: 100px;
      background-color: #f0f0f0;
      border-radius: 50px/100px;
    }
  </style>

  <div class="box"></div> 

在 CSS 中，我们可以通过设置 border-radius 属性来让盒子呈现圆角。而如果想要让盒子只有一半是圆角，我们只需要将 border-radius 的两个值分别设置成半径和高度。

代码中 border-radius 的值为 50px/100px，表示盒子的左上角和右上角分别设置为 50px 的半径，而整个盒子的高度为 100px。这样一来，左下角和右下角就是直角了。

如果想要让其他角也呈现半圆形，只需要在 border-radius 中添加更多的值即可。