html - 将样式应用于元素但不应用于另一个元素内的元素

Question

假设我有一个类似的代码

<input type='text' />
<br />
<iframe>
    <input type='text'>
</iframe>

和风格

input[type='text'] {
    border: 1px solid black;
}

我希望样式仅应用于 iframe 之外的元素。我将如何实现它？我实际上是在查看 css :not 选择器，但我对应该如何使用它感到困惑。我想实现类似的目标

input[type='text'], input:not(iframe) {
    border: 1px solid black
}

或将样式应用于所有文本输入，但不应用于 iframe 内的文本输入。

Answer 1

无法使用 CSS 选择某些元素之外的元素。

您必须创建一个具有所需样式定义的类，并将其分别应用于所有输入。

:not 选择器可用于选择所有元素，但指定为参数的元素例如::not(p) 将选择页面中除段落之外的所有元素.