.choose {counter-reset: fruit;,我来为大家科普一下关于css如何确定属性的值?下面希望有你要的答案,我们一起来看看吧!
![css如何确定属性的值(css计算属性选中的了几项)](http://img.studyofnet.com/upimg/897794863.jpg)
css如何确定属性的值
.choose {
counter-reset: fruit;
}
.choose input:checked {
counter-increment: fruit;
/*属性创建或重置一个或者多个计数器值*/
}
.count:before {
content: counter(fruit);
/*与:before及:after伪类元素配合使用,来插入生成内容*/
}
</style>
</head>
<body>
<div class="choose">
<label><input type="checkbox" />苹果</label>
<label><input type="checkbox" />香蕉</label>
<label><input type="checkbox" />梨子</label>
<label><input type="checkbox" />葡萄</label>
<label><input type="checkbox" />西瓜</label>
<label><input type="checkbox" />椰子</label>
</div>
<p>
您选择了<span class="count"></span>种水果
</p>
</div>
</body>
这个属性,不用使用一句 js 代码,也可计算选中的个数
,