如题所述
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0; padding:0;}
#wrap{ background-image:url(bg.jpg); width:217px; height:64px; color:#FFF; padding-left:15px; padding-top:2px; font-size:14px; font-family:"微软雅黑";}
#text1{ background-image:url(pp.jpg); width:180px;height:29px; padding-left:25px; color:#bbb;}
</style>
</head>
<body>
<div id="wrap">
用户名:
<P><input type="text" id="text1"/ value="请输入字母、数字或中文"></P>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0; padding:0;}
#wrap{ background-image:url(bg.jpg); width:217px; height:64px; color:#FFF; padding-left:15px; padding-top:2px; font-size:14px; font-family:"微软雅黑";}
#text1{ background-image:url(pp.jpg); width:180px;height:29px; padding-left:25px; color:#bbb;}
</style>
</head>
<body>
<div id="wrap">
用户名:
<P><input type="text" id="text1"/ value="请输入字母、数字或中文"></P>
</div>
</body>
</html>
显示的效果：
温馨提示：答案为网友推荐，仅供参考
第1个回答 2015-02-07
用css中的background-image标签.
<input type='text' id='tex2' style='background-image:url(bg.gif)';background-position:right bottom;/>
background-position:right bottom;右下显示，其他位置你自己慢慢尝试；本回答被提问者采纳
<input type='text' id='tex2' style='background-image:url(bg.gif)';background-position:right bottom;/>
background-position:right bottom;右下显示，其他位置你自己慢慢尝试；本回答被提问者采纳
