CSS 实现 checkbox radio 选中后文本颜色改变

<label><input  type="checkbox" checked="checked" value="香蕉"> <span>香蕉</span></label>
input:checked + span {
        color: #337ab7;
        font-weight: bold;
    }

关键点:

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

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

3.使用选择器:     :checked+span  其中 +是相邻兄弟选择器 来实现样式
 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章