Html Css 更改日期输入框高亮颜色

Question

我在页面上有一个日期输入框，我想改变它内部高亮的颜色，但我不知道是否有相应的CSS选择器。

以下是相关图片：

感谢您的关注！ :)

编辑：

这是我想做的事情：

{{link1：}} 转为 {{link2：}}

- alexandre

---

可能是更改文本框高亮颜色的重复问题。 - jimboweb

@jimboweb 这不是同一件事。该帖子讨论的是边框焦点颜色，而我在谈论文本高亮颜色。 - alexandre

只需使用background-color。并不难理解。 - user5014677

好的，请在这里尝试：https://dev59.com/I3E95IYBdhLWcg3wkeof - jimboweb

你需要在这里发布一个最小化的标记示例，以展示问题。https://stackoverflow.com/help/mcve - Rob

Answer 1

如果我找到一个“非webkit”解决方案，我将更新此内容。

感谢Zurb GitHub仓库上的dboskovic。

input::-webkit-datetime-edit-day-field:focus,
input::-webkit-datetime-edit-month-field:focus,
input::-webkit-datetime-edit-year-field:focus {
    background-color: red;
    color: white;
    outline: none;
}

- Simon Juhl

---

你不想把颜色改成和背景颜色一样的颜色，对吧？ - dmikester1

Answer 2

这可能会有所帮助，修改bootstrap.css中的以下CSS条目

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
  border-color: rgba(126, 239, 104, 0.8);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(126, 239, 104, 0.6);
  outline: 0 none;
}

- Saurabh

---

这并没有回答问题。他试图为日期输入设置样式，但你的解决方案在该类型的输入上不起作用。 - Dayron Gallardo

Answer 3

我将我的日期输入设置为文本框，这样::selection就可以在上面起作用。这在Chrome和Edge中对我有效，但是我注意到当与同一语句中的-moz结合使用时，它停止工作。

<style>
    #myInput {
        color: rgb(0, 255, 144); 
    }
    #myInput::selection {
        background-color: rgba(248, 90, 192, 0.56); 
    }
    #myInput::-moz-selection {
        background-color: rgba(248, 90, 192, 0.56); 
    }
</style>

<div class="row">
    <input type="text" id="myInput" value="Test input text" />
</div>

- Kungfoowiz

---

这并没有回答问题。他想要为日期输入设置样式，而你的解决方案在这种类型的输入上不起作用。 - Dayron Gallardo