通过CSS将“必需”文本添加到HTML表单

前端之家收集整理的这篇文章主要介绍了通过CSS将“必需”文本添加到HTML表单前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个< form>看起来像这样:
<form>
  <input type="text" name="name" id="name" /><span class="required"></span>
</form>

我想要做的是在< span>中显示一些文字,例如*或必填项.元素,而不是“硬编码”每个这样的地方的文本我需要文本,所以表单看起来像这样:

[input Box] required

我用Google搜索并发现它可以通过CSS样式使用以下内容来完成:

.required:before
{
  content: "aaaa"
}

但是,我应该使用这种技术(例如,它是否在每个主要浏览器中都受支持)还是有更优选的方式来做这种事情?

谢谢

UPDATE Ps.我不想为此使用JavaScript,只是简单的CSS.

解决方法

我同意在大多数情况下使用CSS添加内容是不对的.但是,在视觉上突出显示所需的字段,我发现完全可以这样做.

内容得不到足够广泛的支持(IE并不支持所有IIRC).

您可以做的是让“必需”范围包含一个包含“必需”文本或星号的背景图像.使用图形文本有一些缺点,但没有一个基于jQuery的解决方案也没有.

猜你在找的CSS相关文章