HTML：

<input type="checkbox" name="gloss" value="feature"/> <span>有光泽</span>

CSS样式：

SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。 
<style type="text/css">
        input:checked + span{
            background-color:#eeeeee;
            color: #337ab7;
            font-weight: bold;
        }

    </style>

关键点:

1.使用label包含  input type='checkbox' 这样点击文本就可以勾选

2.勾选后,只有checkbox 或 radio有:selected状态所以只能设置兄弟节点或直接点. 通过将文本放在span中. 

3.使用选择器:     :checked+span  其中 +是相邻兄弟选择器 来实现样式
---------------------
作者：徐浩刚
来源：CSDN
原文：https://blog.csdn.net/xuhaogang3/article/details/84234597
版权声明：本文为博主原创文章，转载请附上博文链接！

扫码关注我们
微信号：SRE实战
拒绝背锅 运筹帷幄