css原生写圆角搜索框

在CSS中，原生提供了一种简单的方式来创建圆角的搜索框。你可以在<input>元素上直接设置`border-radius`属性，使其四角变圆。下面是一个基本的例子：

<!-- HTML -->
<input type="search" class="rounded-search-box" placeholder="Search...">

/* CSS */
.rounded-search-box {
  border: 1px solid #ccc; /* 边框颜色和宽度可以根据需求调整 */
  padding: 5px; /* 内部填充 */
  border-radius: 4px; /* 设置圆角大小，这里4px是一个常见的值，可根据需要调整 */
  box-sizing: border-box; /* 确保内边距和边框不会影响总尺寸 */
  width: 200px; /* 搜索框宽度 */
}

在这个例子中，`.rounded-search-box` 类将应用于所有`type="search"` 的输入字段，并为其赋予圆角样式。