CSS可以自动添加文本吗？

如果您在此链接检查表单，您会看到必填字段在CSS中有class="required"，在标记中有*。CSS可以自动添加文本吗？

可这显示了标记的*完全用CSS具有此类的div被添加？

2011-01-12 samquo

删除`php`标签。这里没有PHP ... – polarblau 2011-01-12 21:05:45

可以使用after伪类：

，或者因为你明确地要求与该类一个div：

div.required:after { content: "*"; }

，就可以（为IE只因为IE8）

当然，您可以将任何样式应用于此。你甚至可以做这样的事情：

div.required:after:hover { /* Hello, I'm a geek. */ }

这也可以用JavaScript实现。 jQuery的：

$(".required").append("*");

来源

2011-01-12 21:03:56

机器或以*严重*的方式... – 2011-01-12 23:23:55

span:after { content:"*"; }

演示：http://jsfiddle.net/W3gHU/

来源

2011-01-12 21:04:24

您可以使用此:after或before CSS伪元素，更多的信息，也ABT哪些浏览器支持here。

来源

2011-01-12 21:04:45 Colin

试试这个页面：

<html> 

<style> 
.required:after { 
    color: red; 
    content: "*" 
} 
</style> 

<body> 

<div class="required">Name</div> <input type="text"> 
<div class="required">Email</div> <input type="text"> 

</body> 

</html>

：是：之后被除IE（希望IE9将支持）可能一切

更新考虑到森达维达斯的帐户评论了解只是使用的例子。当然，这会带来更多的意义，如果我们做出这样说：

.required:before { 
    color: red; 
    content: "*" 
} 
.... 
<div>Name <input type="text" class="required"> </div>

那么我们甚至可以添加不显眼的JavaScript验证该字段（所以这种方式带来了良好的优势）。问题是，这个重构页面将会显示，因为我们只希望它在Opera中（我检查了所有浏览器的最新版本，除了FireFox 4，但我不确定FF会改变他们考虑这种风格的方式）。
：之后和：之前不工作的输入和img元素; there is相关的讨论为什么。 $（“。required”）.jquery之前的（“*”）可以在任何地方工作，但这更多的是关于JavaScript和CSS（之前被其他人提到）。

来源

2011-01-12 21:06:30 Maxym

如果您将INPUT元素放入DIV内，这会更有意义。 – 2011-01-12 21:37:29

您可以通过CSS添加恒星图像。这应该适用于所有浏览器。

.required 
{ 
background-image:url(/path/to/your/images/dir/required-field.png); 
background-position:top right; 
background-repeat:no-repeat; 
padding-right:10px; 
}

来源

2011-01-12 21:07:02

CSS可以自动添加文本吗？

回答

相关问题