【问题标题】:Changing the color of placeholder text of a select element [duplicate]更改选择元素的占位符文本的颜色[重复]
【发布时间】:2020-04-14 18:16:37
【问题描述】:

根据对 stackoverflow question 的回答。我在 html 选择元素中添加了一个占位符。

  <option value="" selected disabled hidden><strong style="color:white">Choose here</strong></option>

现在的问题是,我想将占位符文本的颜色更改为白色,因为我的背景是灰色的。它不接受任何样式。

【问题讨论】:

  • 我很抱歉,但与关闭我的问题类似的问题并没有解决我的问题。那只是改变输入元素的占位符!

标签: html css


【解决方案1】:

您可以在 CSS 中使用 ::placeholder 伪,例如:

::placeholder { color: #fff; }

如果你想要一个跨浏览器的解决方案,你可以使用前缀:

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #fff;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #fff;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #fff;
}
:-moz-placeholder { /* Firefox 18- */
  color: #fff;
}

::placeholder 选择器仅选择输入中的占位符文本,除此之外,您可以在显示占位符时使用 :placeholder-show 设置输入本身的样式。

另外,请注意 Firefox 显示的占位符文本可能比它应该显示的要浅。解决您可以使用的问题:

::-moz-placeholder {
  opacity: 1;
}

【讨论】:

    【解决方案2】:

    是谷歌的材料设计吗?
    如果它的谷歌材料设计我发现这个答案是你的解决方案我不想相信别人负担得起所以有链接click here
    如果它不是材料设计,你试过吗?

    ::placeholder {
      color: white;
    }
    

    它被称为伪\元素 你可以读到他们here
    我写的例子取自here

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-04-06
      • 2013-05-12
      • 1970-01-01
      • 2021-03-29
      • 1970-01-01
      • 1970-01-01
      • 2017-05-18
      • 2013-02-04
      相关资源
      最近更新 更多