参见英文答案 >
Can I use the :after pseudo-element on an input field?17
刚刚玩：之前和之后.
刚刚玩：之前和之后.
看来我不能用/输入按钮使用它们？想到我可以使用它会为必填字段显示一个星号.不一定我会做,只是一个选择
input {
position: relative;
}
input:after {
content: '';
background: url(accept.png) 0 0 no-repeat;
height: 16px;
position: absolute;
right: -20px;
top: 5px;
width: 16px;
}
相同的代码在li上正常工作
li {
clear: both;
margin: 0 0 10px;
position: relative;
}
li:after {
content: '';
background: url(accept.png) 0 0 no-repeat;
height: 16px;
position: absolute;
right: -20px;
top: 5px;
width: 16px;
}
解决方法
我也认为同样的事情是有用的,但唉,最简单的方法是使之前/之后的伪元素可靠地工作,是将输入包装在一个SPAN标签中并应用一个类.
这个讨论提供了一些洞察为什么输入：以后不工作：
http://forums.mozillazine.org/viewtopic.php?f=25&t=291007&start=0&st=0&sk=t&sd=a
你可以这样做：
.required:after { content: "required"; color: orange; margin-left: 1em; /* space between the input element and the text */ padding: .1em; background-color: #fff; font-size: .8em; border: .1em solid orange; } <span class="required"><input id="foo" /></span>
