<!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>無標(biāo)題文檔</title>
<style?type="text/css">
body,input,form,button,div{margin:0;
padding:0;}
????form{width:250px;
????????background:rgb(140,160,150);
????????border:1px?solid?black;}
????.mid{display:block;
????????margin:10px?auto;
????????border:1px?solid?black;
????????height:20px;
????????width:200px;
????}
????p{??font-size:13px;
????????display:inline;}
????a{??text-decoration:none;
????????margin-left:20px;
????}
????.btn{
????????width:180px;
????????height:42px;
????????margin:10px?auto;
????????
????????display:block;
????????background-image:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg);
????}
????#btn1{
????????background-position:0px?0px;
????}
????#btn2{
????????background-position:0px?-39px;
????}
????
????#text{margin-left:20px;}?
????div{
????????margin-top:20px;
????}
????
</style>
</head>
<body>
<form>
<div>
????<input?class="mid"?type="text"?name="username"?placeholder="郵箱/手機號/用戶名"><br/>
????<input?class="mid"?type="password"?name="pwd"?placeholder="請輸入密碼"><br/>
????<input?id="text"?type="radio"?name="radio"><p>下次自動登錄</p>??
????<a?href="#">忘記密碼？</a>
????<button?class="btn"?id="btn1"?type="button"></button>
????<button?class="btn"?id="btn2"?type="button"></button>
???</div>?
</form>
</body>
</html>
為啥我這個按鈕看起來這么不正常，求大神解釋
qq_安仁斗辣椒_0
2015-09-10 11:55:28
你要的效果估計是這樣的吧