css 表单

代码:

<html>
<head>
<style>
input[type=text]{
    width:50%;
    padding:12px 20px;
    margin:8px 0;
    box-sizing:border-box;
    border:3px solid #ccc;
    -webkit-transition:0.5s;
    outline:none;
    border-radius:5px;
}
input[type=text]:focus{
    border:3px solid red;
}
input[type=password]{
    width:50%;
    padding:12px 20px;
    margin:8px 0;
    box-sizing:border-box;
    border:3px solid #ccc;
    -webkit-transition:0.5s;
    outline:none;
}
input[type=password]:focus{
    border:3px solid red;
    background-color:#000;
}
select{
    width:50%;
    padding:16px 20px;
    margin:none;
    border-radius:4px;
    background-color:#f1f1f1;
}
input[type=reset],input[type=submit]{
    background-color: #4caf50;
    border:none;
    color:white;
    padding:16px 50px;
    text-decoration:none;
    margin:6px 2px;
    cursor:pointer;
    margin-left:40px;
}
</style>
</head>
<body>
<form>
<label for="fname"> 姓名:</label>
<input type="text" id="fname" name="fname" value="pppp"></input></br>
<label for="fname">密码:</label>
<input type="password" id="lname" name="lname"maxlength="1"></input></br>
<label for="fname">地址:</label>
<select id="country"name="country">
    <option value="aa">11</option>
    <option value"bb">22</option>
</select></br>
<input type="reset" value="重填">
<input type="submit" value="提交">
</form>
</body>
</html>