如何使用CSS设置<input>标签的背景小图标简单

最新推荐文章于 2024-06-18 17:03:40 发布

dbeautifulLife

最新推荐文章于 2024-06-18 17:03:40 发布

阅读量1.4k

点赞数

分类专栏： javaWeb开发

57 篇文章 0 订阅

订阅专栏

[html]view plaincopy 
  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url=http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="[url=http://www.w3.org/1999/xhtml]http://www.w3.org/1999/xhtml[/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="[url=http://www.softwhy.com/]http://www.softwhy.com/[/url]" />
<title>蚂蚁部落</title>
<style type="text/css">
ul
{
list-style:none;
}
li
{
height:30px;
}
input
{
width:140px;
height:20px;
line-height:20px;
border:1px solid #0CF;
padding-left:20px;
}
.myname
{
background:url(mytest/div+css/stock_people.png) center left no-repeat;
}
.mypw
{
background:url(mytest/div+css/security.png) center left no-repeat;
}
</style>
</head>
<body>
<ul>
<li><input type="text" class="myname" name="username" /></li>
<li><input type="text" class="mypw" name="password" /></li>
</ul>
</body>
</html>