小羊也疯狂 2018-05-27 10:12 采纳率: 100%
浏览 1288
已采纳

判断是否checked然后给另外一个元素添加样式的选择器怎么写

我用js实现的这个,想纯用css 这里的选择器不会选,该怎么写?
图片说明
图片说明
主要就是通过是否checked控制left right,这个第二行代码选择器怎么写
同时最好解决一下代码冗余

 #switch{position: absolute;width: 50px;  height: 30px; border-radius: 15px;  background-color: white;top:5px;left: 5px}
 input:checked#switch{position: absolute;width: 50px;  height: 30px; border-radius: 15px;  background-color: white;top:5px;left: 5px}
 <main>
        <input type="checkbox" id="box" checked>
        <span id="switch" class="left"></span>
        <span class="bg">
            <label for="box">ON</label>
            <label for="box">OFF</label>
        </span>
    </main>
  • 写回答

1条回答 默认 最新

  • Go 旅城通票 2018-05-27 11:34
    关注

    用兄弟选择器+

     input:checked + #switch{position: absolute;width: 50px;  height: 30px; border-radius: 15px;  background-color: #f00;top:5px;left: 5px}
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 C# P/Invoke的效率问题
  • ¥20 thinkphp适配人大金仓问题
  • ¥20 Oracle替换.dbf文件后无法连接,如何解决?(相关搜索:数据库|死循环)
  • ¥15 数据库数据成问号了,前台查询正常,数据库查询是?号
  • ¥15 算法使用了tf-idf,用手肘图确定k值确定不了,第四轮廓系数又太小才有0.006088746097507285,如何解决?(相关搜索:数据处理)
  • ¥15 彩灯控制电路,会的加我QQ1482956179
  • ¥200 相机拍直接转存到电脑上 立拍立穿无线局域网传
  • ¥15 (关键词-电路设计)
  • ¥15 如何解决MIPS计算是否溢出
  • ¥15 vue中我代理了iframe,iframe却走的是路由,没有显示该显示的网站,这个该如何处理