webkit css时间字段的伪元素

Question

我发现了一篇关于输入here的webkit伪元素的有趣文章，所以我需要从输入类型=“时间”中删除取消按钮，但是根据murthy定律，这个伪元素完全没有在任何地方描述。如果有人知道请发帖给我。

P.S。我已经尝试了

::-webkit-search-cancel-button
::-webkit-input-cancel-button 
::-webkit-time-cancel-button
::-webkit-time-cancel-button

当然有一种方法可以使用:after元素执行此操作，但我不相信此元素没有伪元素

input[type="time"]::after
{
    content: "";
    background: #FFF;
    height: 20px;
    width: 10px;
    position: absolute;
    margin: 0 -10px;
}

Answer 1

那将是::-webkit-clear-button

所以使用

input[type="time"]::-webkit-clear-button{
    display:none;
}

要查找此类内容，您可以在 元素 下的控制台选项中启用 显示Shadow DOM 。< / p>

这样当您选择input元素时，您可以打开它并查看引擎盖下..

Answer 2

我知道Internet Explorer 10支持::-ms-clear这样的伪元素 因此，我在Chromium的源代码中searched获取了“webkit-clear”并发现了::-webkit-clear-button的存在。

This JSFiddle表明::-webkit-clear-button伪元素具有所需的效果。

input[type="time"]::-webkit-clear-button {
    display: none;
}