仅将占位符中的星号更改为红色

Question

我在使用占位符时遇到问题。我想将占位符内星号的颜色更改为红色，其余部分为暗黑色。

我正在使用 bootstrap .form-control 进行标记。

我想知道是否有 plugin/easy 方法可以做到这一点。 JS 或 CSS.

Answer 1

我不知道有什么简单的方法可以在占位符中使用 2 种颜色。

您可以尝试使用 -webkit-input-placeholder::after 在占位符后添加一个星号，并更改其颜色，但此解决方案并不适用于所有浏览器：

您可以尝试这样的操作并将您的占位符添加为标签...

input[required] + label {
    position: relative;
    left: -170px; /* move the label left and place it inside the input */
    color: #757575; /* placeholder color here */
}

input[required] + label:after {
    content:'*';
    color: red;
}

<input type="text" id="myInput" name="myInput" required="required" />
<label for="myInput">IME IN PRIIMEK</label>

仅将占位符中的星号更改为红色

change only the asterisk in placeholder to red

placeholder