样式 sheet 之外的选择器 CSS

Question

我正在寻找一种方法，使某些 CSS 仅在样式 sheet 之外的输入具有特定值时才适用。

在下面的示例中，如果下面的输入值为“4625585”，我只想运行 CSS。

它来自提交按钮发送输入值（以及其他内容）的表单。

当我只能访问 CSS 而不能访问表单的 HTML 代码时，这是否可能。

您好，拉斯穆斯

-

这里是CSS

<style type="text/css">
    .wForm {
        font-family: sans-serif;
    }      
</style>

<input value="4625585">

-

这里是 HTML:

<form>
    <div id="tfa_6" class="wForm">
        <input type="text" placeholder="Name">
    </div>

    <div class="actions">
        <input type="submit" value="Submit">
    </div>

    <input value="4626442">
</form>

Answer 1

您只能将 CSS 应用于经过验证的元素之后的同级元素。因此，我将带有 value 4625585 的 input 元素移动到表单的顶部。

如果您无法访问 HTML，您将需要 javascript。

input[value="4625585"] ~ .wForm {
  background: red;
}

<form>

  <input value="4625585">
  
  <div id="tfa_6" class="wForm">
    <input type="text" placeholder="Name">
  </div>

  <div class="actions">
    <input type="submit" value="Submit">
  </div>

</form>

Answer 2

已在已删除的威胁中评论并回答了该问题。这个简短的回答是 "no, it can't be done".

样式 sheet 之外的选择器 CSS

Selector outside of style sheet with CSS

html

css

css-selectors

selector