相关疑难解决方法(0)

有什么好方法可以克服这段代码不能按预期工作的不幸事实:

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

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

在一个完美的世界中,所有必需的inputs都会得到一个小星号,表明该字段是必需的.这个解决方案是不可能的,因为CSS是在元素内容之后插入的,而不是在元素本身之后插入,但类似的东西是理想的.在一个包含数千个必填字段的网站上,我可以在输入前移动星号,只需更改一行(:after到:before)或我可以将其移动到标签的末尾(.required label:after)或标签的前面,或者包装盒等位置......

这一点非常重要,不仅仅是因为我改变了我的想法,无论在哪里放置星号,还要考虑表格布局不允许星号位于标准位置的奇怪情况.它也适用于检查表单或突出显示不正确完成的控件的验证.

最后,它不会添加额外的标记.

是否有任何好的解决方案具有不可能代码的全部或大部分优势？

我有多个输入字段,一些字段是required必需的字段提及*所以我只需要更改输入占位符*颜色,而不是更改整个占位符颜色检查下面的图像我真正需要的.

我尝试过以下代码来实现这一点,但它可以改变占位符的整个颜色

div {
  margin:10px 0px;
}
input {
  width: 200px;
  border: none;
  border-bottom: solid 1px #8d97a0;
  padding: 5px;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
::-webkit-input-placeholder {
  color:red;
}

<div>
  <input type="name" name="name" id="name" placeholder="Name *">
</div>
<div>
  <input type="Email" name="email" id="email" placeholder="Email">
</div>
<div>
  <input type="phone" name="phone" id="phone" placeholder="Phone">
</div>
<div>
  <input type="password" name="password" id="password" placeholder="Password *">
</div>

我需要创建一个HTML文本输入元素,其中包含多色占位符文本.除了之外,所有文本都应该是灰色的,但是关闭的星号应该是红色的,如:

由于浏览器限制了我们对原生输入元素进行样式化的能力,这实际上要复杂得多,这实际上要复杂得多.

我听说有人使用CSS来覆盖原生输入样式,所以他们可以使用自定义字体等,但有两种特殊的文字样式(灰色和红色)吗？或者我是否需要使用替代(非本机)输入？

如何把fontawesome放在占位符中.这是我的代码:

<div class="form-group">         
    <input class="form-control" placeholder="username" id="inputdefault" type="text" />
    <input class="form-control" placeholder="password" id="inputdefault" type="text" />
</div>

CSS中的一个输入占位符中是否可以有2种不同的字体大小？

像这样的设计:

在常规html中,你可以使用span,:before,&:after等.

但在输入中你不能做所有这些事情,所以我想了解它是否可能......

谢谢