相关疑难解决方法(0)

我可以在输入字段上使用:before或:after伪元素吗?

我试图:afterinput字段上使用CSS伪元素,但它不起作用.如果我使用它span,它可以正常工作.

<style type="text/css">
.mystyle:after {content:url(smiley.gif);}
.mystyle {color:red;}
</style>
Run Code Online (Sandbox Code Playgroud)

这是有效的(在"buu!"之后和"更多"之前放置笑脸)

<span class="mystyle">buuu!</span>a some more
Run Code Online (Sandbox Code Playgroud)

这不起作用 - 它只用红色调色someValue,但没有笑脸.

<input class="mystyle" type="text" value="someValue">
Run Code Online (Sandbox Code Playgroud)

我究竟做错了什么?我应该使用另一个伪选择器吗?

注意:我不能添加span我的input,因为它是由第三方控件生成的.

html css pseudo-element css-content

648
推荐指数
15
解决办法
44万
查看次数

在'input'元素之前或之后生成CSS内容

在Firefox 3和Google Chrome 8.0中,以下工作正常:

<style type="text/css">
    span:before { content: 'span: '; }
</style>

<span>Test</span> <!-- produces: "span: Test" -->
Run Code Online (Sandbox Code Playgroud)

但是当元素是<input>:

<style type="text/css">
    input:before { content: 'input: '; }
</style>

<input type="text"></input> <!-- produces only the textbox; the generated content
                                 is nowhere to be seen in both FF3 and Chrome 8 -->
Run Code Online (Sandbox Code Playgroud)

为什么它不像我预期的那样工作?

html css

179
推荐指数
3
解决办法
19万
查看次数

标签 统计

css ×2

html ×2

css-content ×1

pseudo-element ×1