Question

我试图在选择选项之前选择下拉菜单，其中文本为灰色，然后在选择选项后选择蓝色。到目前为止，我已经到了选择时变为蓝色的点，但是当你点击其他地方后它又变回灰色。这是我的代码：

＆＃13;

.form-control,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
input[type="number"],
textarea,
.select {
  padding: 10px 15px;
  border: #383839 2px solid;
  color: #8c8c8c;
  font-weight: 700;
  /*18px*/
  font-size: 1.125rem;
  border-radius: 4px;
}

.form-control:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
textarea:focus,
.select:focus {
  box-shadow: none;
  border-color: #383839;
  color: #3a577d;
}

.form-control option:checked {
  color: #3a577d;
}

form input[type=text] {
  color: #3a577d;
}

＆＃13;

<select class="form-control">
        <option value="" disabled selected>Exp. Month</option>
        <option>January</option>
        <option>February</option>
        <option>March</option>
        <option>April</option>
        <option>May</option>
        <option>June</option>
        <option>July</option>
        <option>August</option>
        <option>September</option>
        <option>October</option>
        <option>November</option>
        <option>December</option>
    </select>

＆＃13;

问题是当我检查选中的选项时，选项：已检查CSS正在应用。我也尝试将样式内联，即使不起作用，颜色也保持不变。

样式选项选定的颜色

0 个答案: