首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >带有复选框的列表更改选中文本的样式

带有复选框的列表更改选中文本的样式
EN

Stack Overflow用户
提问于 2015-07-16 01:42:29
回答 1查看 32关注 0票数 1

这就是问题所在。我想要一份名单。它必须是一个列表,而不是一个带有标签和输入的表单,当它被选中时,文本应该被划线。

这就是我所拥有的,但如果选中,直通的CSS就不起作用了:

代码语言:javascript
运行
复制
li input:checked  {
  text-decoration: line-through;
}
代码语言:javascript
运行
复制
<ul>
  <li>
    <label for="todo"></label>
    <input type="checkbox" name="list" id="todo">Setup todo List
  </li>
</ul>

EN

回答 1

Stack Overflow用户

发布于 2015-07-16 02:13:22

您应该将文本放在标签内,并将标签放在输入之后。

代码语言:javascript
运行
复制
li > input:checked + label {
  text-decoration: line-through;
}
代码语言:javascript
运行
复制
<ul>
  <li>
    <input type="checkbox" name="list" id="todo">
    <label for="todo">Setup todo List</label>
  </li>
</ul>

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31437416

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档