网页设计中很重要的就是美化页面，我们这里主要以美化输入框为例，介绍一下css美化输入框的方法。在网页中需要插入很多表单、输入框、按钮、文本框之类的内容，它们是用户和网站交互所必不可缺少的元素。

为了达到更好的交互效果，提高用户友好度，对文本框输入框之类的美化工作是很必要的。

一般的美化工作可以直接通过使用CSS完成，方法也十分简单，如下：

 

1、首先制作一张输入框的背景图，如上图所示。

2、添加按钮的Html代码：


<input type="button" class="Selectbg">

<style>
body{font-size:12px; }
.Selectbg{ border:none; width:150px; height:20px; background-image:url(image.gif); text-align:left;line-height:20px; }
</style>