如何在所需的html输入label的右上角添加红点，就像星号一样？

Question

我想在所需输入的 html label 中添加点代替星号。它应该像星号一样位于右上角。

Answer 1

为了使输入元素中的必需属性影响 label，label 必须位于输入元素之后。

当输入具有所需属性（使用 CSS 属性选择器工具）时，此代码段通过在 label 上使用伪后元素在 label 的末尾添加一个红色小圆圈。

 label { position: relative; } input[required]+label::after { content: ''; width: 10px; height: 10px; top: -5px; border-radius: 50%; position: relative; background: red; display: inline-block; }

 <input required><label>I am the label</label>

请注意，如果您希望布局不同，例如输入之前或之上的 label，则必须进行进一步定位。

Answer 2

您应该根据需要在之前或之后使用。

label.required:before {
    content: ". ";
}