今天看到一个关于给input添加背景的一个例子,就是很常见的搜索框后面带着一个搜索图标,所以自己也练习着做了一个。
显示结果如下图:
[img]http://dl.iteye.com/upload/picture/pic/44445/77b64fc0-5780-3a52-a385-7d69e12512c0.jpg[/img]
如果没有设置line-height属性,文字将会出现在背景的上面,而不是合适的位置。
<style>
input
{
background:url(images/1.jpg) no-repeat;
border:none;
height:32px;
width:333px;
line-height:32px;
padding:0px 5px;
}
</style>
<input />
显示结果如下图:
[img]http://dl.iteye.com/upload/picture/pic/44445/77b64fc0-5780-3a52-a385-7d69e12512c0.jpg[/img]
如果没有设置line-height属性,文字将会出现在背景的上面,而不是合适的位置。