选择框元素和:之后

Question

为什么它不起作用？有没有添加额外元素的解决方案？

http://jsfiddle.net/86gb2/

Answer 1

在您的小提琴中,以下声明可能没有达到预期效果.

select:after {content: "This doesn't work";}

这实际上会将文本附加到选择框的内容之后,而不是在选择框本身之后.因此,option在标记的最后一个文本之后添加文本.(当然这既不是有效的,也不会由浏览器呈现.)

换句话说,如果你有这个标记:

<a href="#">My link</a>

这个CSS:

a:after {content: " has now been appended to";}

实际发生的是这个:

<a href="#">My link has now been appended to</a>