如何在所需的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: ". ";
}