我的网站设计包括文本输入字段,如下所示:
输入字段http://img401.imageshack.us/img401/4453/picture1ts2.png
我想知道创建这个输入字段的最佳解决方案是什么.
我的一个想法是在输入周围始终使用背景图像并在输入字段上禁用所有边框并指定宽度(以像素为单位),例如:
<div class="borderedInput"><input type="text" /></div>
Run Code Online (Sandbox Code Playgroud)
我试图阻止他们使用这种格式,但他们不会气馁,所以看起来我将不得不这样做.
这是最好还是有另一种方式?
-
试用:
我尝试了以下方法:
<style type="text/css">
input.custom {
background-color: #fff;
background:url(/images/input-bkg-w173.gif) no-repeat;
width:173px;
height:28px;
padding:8px 5px 4px 5px;
border:none;
font-size:10px;
}
</style>
<input type="text" class="custom" size="12" />
Run Code Online (Sandbox Code Playgroud)
但在IE(6和7)中,当您输入的宽度超过宽度时,它会执行以下操作: