我面临着开发自定义单选按钮的任务。为了避免样式问题,我想知道所有可能的预定义状态(如已检查,活动和其他状态),以便为他们制定CSS规则,以确保我不会有一些意想不到的样式。
这些州及其组合是什么?
答案 0 :(得分:2)
在W3C Selectors Level 3 document中,有以下状态伪类可应用于无线电元素:
请记住,无法检查无线电元素,有必要提及存在未经检查的状态。这些状态成对出现,每对中的一个状态始终存在。这样我们现在可以获得4种状态(可以在下面的思维导图中找到)。
确实存在可以应用于html radio元素的动态伪类:
它们可以任意组合使用或根本不使用。它们有8种可能的组合。将此与4个启用禁用,已选中未选中对组合在一起,我们可以在下面的思维导图中找到32个可能的声明(缩放以查看完整大小): 包含至少两个从checked-unchecked节点计数的节点的每个pass都是一个状态,例如:
在每条已启用的路径附近,都会显示单选按钮状态的图片,因为它现在在MacOS Sierra的Chrome浏览器中实现。每个禁用路径只有一个图片 - 对于其他禁用状态,它们都是相同的。总共有10张图片代表每个州。数字用于方便。