<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>input背景的兼容性</title>
<style type="text/css">
*{margin:0;padding:0;}
p{padding:20px;}
.ctl{background:transparent url(down.png) no-repeat scroll 2px top;line-height:19px;width:150px;height:20px;padding-left:25px;border:1px solid #DDD;}
.ctl_wraper{background:transparent url(down.png) no-repeat scroll 147px ;display:inline-block;width:150px;height:20px;padding-right:10px;border:1px solid #DDD;}
.ctl_wraper input{background-color:transparent;width:150px;padding-top:2px;border:0 none;}
</style>
</head>
<body>
<h1>IE瀏覽器下，可查看區別</h1>
要查看區別，請將光標置於文本框內的文字末尾。
<p>
出現問題<br />
<input class="ctl" type="text" value="這個是input背景圖片兼容性實例" />
</p>
<p>
兼容解決<br />
<span class="ctl_wraper"><input type="text" value="這個是input背景圖片兼容性實例" /></span>
</p>
</body>
</html>
