兩個都選上的情況??
出現了兩個都選上的情況
<!DOCTYPE html>
<html>
<head>?
<meta charset="utf-8">
<title>屬性選擇器</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>?
<body>
<form action="#">
? <div class="wrapper">
? ? <div class="box">
? ? ? <input type="checkedbox" checked="checked" ?id="boy" name="1" /><span></span>
? ? </div>
? ? <label for="boy">男</label>
? </div>
??
? <div class="wrapper">
? ? <div class="box">
? ? ? <input type="checkbox" ?id="girl" name="1" ?/><span></span>
? ? </div>
? ? <label for="girl">女</label>
? </div>
</form>?
</body>
</html>
form {
? border: 1px solid #ccc;
? padding: 20px;
? width: 300px;
? margin: 30px auto;
}
.wrapper {
? margin-bottom: 10px;
}
.box {
? display: inline-block;
? width: 30px;
? height: 30px;
? margin-right: 10px;
? position: relative;
? background: orange;
? vertical-align: middle;
? border-radius: 100%;
}
.box input {
? opacity: 0;
? position: absolute;
? top:0;
? left:0;
? width: 100%;
? height:100%;
? z-index:100;/*使input按鈕在span的上一層,不加點擊區域會出現不靈敏*/
}
.box span {?
? display: block;
? width: 10px;
? height: 10px;
? border-radius: 100%;
? position: absolute;
? background: #fff;
? top: 50%;
? left:50%;
? margin: -5px 0 ?0 -5px;
? z-index:1;
}
input[type="radio"] + span {
? opacity: 0;
}
input[type="checkbox"]:chec
2015-10-10
<input type="checkedbox">這個是多選框,所以當然可以二個都選上
單選框 是<input type="radio"/>
2015-10-10
還有多選框是checkbox,不是checkedbox