css中搜索框是怎么写得

在网页设计中，搜索框是一个非常重要的元素。HTML提供了input标签来创建输入框，而我们可以使用CSS来美化样式。

input[type="text"]{
		width: 200px;
		height: 30px;
		padding: 5px;
		border: none;
		box-shadow: 0 0 5px #888;
		border-radius: 15px;
		font-size: 16px;
	}

	input[type="text"]:focus{
		outline: none;
		box-shadow: 0 0 10px #888;
	} 

通过上述代码，我们定义了搜索框的基本样式。首先，我们选择了所有type为text的input元素，并给他们设置了宽度、高度、内边距等基本属性。然后，我们使用了CSS3的box-shadow属性来制作了一个简单的阴影效果，并使用了border-radius属性来实现圆角的效果。

为了增强用户体验，当搜索框被选中时，我们使用:focus伪类取掉了默认的外边框，并将box-shadow的值增大，让搜索框更加突出。

当然，实际的搜索框可能需要更多的样式，例如背景图片、按钮等等。但是，通过以上的示例，我们可以看到CSS给予我们很大的自由度，让我们能够轻松地定制自己的搜索框样式。