Tag: 伪元素的

为什么不：在pseudo元素和`img`元素一起工作之前和之后？

我正在尝试使用一个img元素:before伪元素。 考虑这个HTML和CSS … HTML <img src="http://0.gravatar.com/avatar/this-is-not-a-hash" alt="" /> CSS img:before { content: "hello"; } jsFiddle 。 这不会产生所需的效果（在Chrome 13和Firefox 6中testing过）。 但是，它适用于div或span元素。 为什么不？ 有没有办法让伪元素与img元素一起工作？

CSS内容属性：是否可以插入HTML而不是文本？

只是想知道是否有可能以某种方式使CSS content属性插入HTML代码而不是string:before或:after的元素如： .header:before{ content: '<a href="#top">Back</a>'; } 这将是相当方便的…它可以通过Javascript来完成，但使用CSS这将真正使生活更容易:)

为什么：之前和之后：伪元素需要“内容”属性？

鉴于以下情况，为什么afterselect器需要content属性才能运行？ .test { width: 20px; height: 20px; background: blue; position:relative; } .test:after { width: 20px; height: 20px; background: red; display: block; position: absolute; top: 0px; left: 20px; } <div class="test"></div> 请注意，除非指定内容属性，否则不会看到伪元素： .test { width: 20px; height: 20px; background: blue; position:relative; } .test:after { width: 20px; height: 20px; background: red; display: block; position: absolute; top: 0px; […]

我可以使用input字段上的伪元素之前或之后：？

我试图使用:after input字段上的CSS伪元素:after ，但它不起作用。 如果我使用span ，它工作正常。 <style type="text/css"> .mystyle:after {content:url(smiley.gif);} .mystyle {color:red;} </style> 这样做（把“buu！”之后和“更多”之前的笑脸） <span class="mystyle">buuu!</span>a some more 这是行不通的 – 它只会使某些颜色变红，但是没有笑脸。 <input class="mystyle" type="text" value="someValue"> 我究竟做错了什么？ 我应该使用另一个伪select器？ 注意：我无法在我的input添加一个span ，因为它是由第三方控件生成的。