如何制作透明的搜索框

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
form { width: 1000px ; height: 600px; background-image: url("22.jpg"); background-position: -100px -200px; }
div { float: left; border: 1px solid black; background: lightgray; opacity: .5;}
input[type="text"] { border: none; margin-left: 5px; background: lightgray; opacity: .5; }
input[type="submit"] { border: none; background: none; background-image:url("fangdajing_07.png"); width: 30px; height:30px;
background-repeat:no-repeat; background-position: 2px 2px; }
input[value="登录"] { border:none; background: none; margin-top: 8px; margin-left: 10px; color: white;}
input[value="注册"] { border:none; background: none; margin-top: 8px; color: white;}
input[value="登录"]:hover { color: gray;}
input[value="注册"]:hover { color: gray;}
</style>
</head>
<body>
<form action="">
<div>
<input type="text" placeholder="请输入您想知道的内容"/>
<input type="submit" value="&nbsp;"/>
</div>
<input type="button" value="登录" />
<input type="button" value="注册" />
</form>
</body>
</html>
posted @ 2016-04-23 23:41  liangliang74  阅读(1199)  评论(0编辑  收藏  举报