css input required not focused or disabled

Question

我正在尝试创建一个 css 规则来更改输入的背景颜色(如果需要)，但机器人已禁用或处于焦点状态

我有这个，但显然没有用!

<input type="tel" class="form-control" placeholder="Phone" name="phone" value="" required>

和CSS:

input:not(disabled):not(focus):required {
    background-color: rgba(255,0,0,.10)
}

Answer 1

使用 : 作为伪选择器 :disabled 和 :focus

input:required:not(:disabled):not(:focus)