是:before伪元素允许输入[type = checkbox]? [英] Is the :before pseudo-element allowed on an input[type=checkbox]?
问题描述
此StackOverflow答案介绍了如何使用CSS3对复选框进行样式设置,而不需要使用< label>
:
This StackOverflow answer describes how to style checkboxes using CSS3 without requiring a <label>
:
input[type=checkbox]:before {
content:""; display:inline-block; width:12px; height:12px; background:red;
}
Fiddle
这适用于Chrome 22,但不适用于Firefox 15或IE 9。
This works in Chrome 22 but not in Firefox 15 or IE 9.
推荐答案
这是未知的土地;规格不清楚的东西。 CSS 2.1规范说明:注意。本规范没有完全定义:被替换的元素(例如HTML中的IMG)之前和之后的交互。这将在未来规范中更详细地定义。可以说,INPUT可以看作是一个在CSS 2.1意义上替换元素。
This is uncharted land; the specifications do not clear things up. The CSS 2.1 spec says: "Note. This specification does not fully define the interaction of :before and :after with replaced elements (such as IMG in HTML). This will be defined in more detail in a future specification." And, debatably, INPUT could be seen as a replaced element in CSS 2.1 sense.
可能会认为这些伪元素不能用于不能包含任何内容的元素(即,具有EMPTY已声明内容),例如IMG或INPUT。但是,措词提到IMG和附录D 有一个规则,选择器 br:before
。
One might think that these pseudo-elements cannot be used for elements that cannot have any content (i.e., with EMPTY declared content), such as IMG or INPUT. However, the wording mentions IMG, and Appendix D has a rule with the selector br:before
.
CSS3选择器是CSS3中已达到推荐状态的少数部分之一, em>不是清除的东西。 它说::: before和:: after伪元素可以用于在元素的内容之前或之后描述生成的内容。它们在CSS 2.1 [CSS21]中解释。
And CSS3 Selectors, one of the few parts of CSS3 that have reached recommendation status, does not clear things up. It says: "The ::before and ::after pseudo-elements can be used to describe generated content before or after an element's content. They are explained in CSS 2.1 [CSS21]."
这篇关于是:before伪元素允许输入[type = checkbox]?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!