我正在尝试为<input>HTML5中的提出一些好的默认样式,并尝试了以下方法:
<input>
input::after { display: inline; } input:valid::after { content: ' ✓ '; color: #ddf0dd; } input:invalid::after { content: ' ✗ '; color: #f0dddd; }
las,::after内容从不显示。对于伪元素,双冒号和单冒号都不是问题。我都尝试过。拥有一个伪元素和一个伪类也不是问题。我已经尝试过不使用:valid和了:invalid。在Chrome,Safari和Firefox中,我得到了相同的行为(Firefox没有:valid和:invalid类,但是我尝试了不使用它们。)
::after
:valid
:invalid
在伪元素工作细<div>,<span>,<p>,和<q>元素-其中一些是块元件和一些是内联。
<div>
<span>
<p>
<q>
因此,我的问题是:为什么浏览器同意<input>s没有::after?我在规范中找不到任何可以表明这一点的东西。
如您在这里阅读的http://www.w3.org/TR/CSS21/generate.html,:after仅适用于具有(文档树)内容的元素。<input>没有内容,以及<img>或<br>。
<img>
<br>