webkit css pseudo elements for time field

问题

I found an interesting post about webkit pseudo elements for inputs here, so I needed to remove cancel button from input type="time", but by murthy's law exactly this pseudo element not described anywhere. If someone knows please post me.

P.S. I already tryed

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

Of course there is a way to do this with :after element, but I don't believe there are no pseudo element for this

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

回答1:

That would be ::-webkit-clear-button

So use

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

To find such things you can enable Show Shadow DOM from the console options, under Elements.

This way when you select the input element, you can open it and look under the hood..

回答2:

I knew that Internet Explorer 10 supports such a pseudo-element with ::-ms-clear.
So I searched in the source code of Chromium for "webkit-clear" and discovered the presence of ::-webkit-clear-button.

This JSFiddle shows that the ::-webkit-clear-button pseudo-element has the desired effect.

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

来源：https://stackoverflow.com/questions/17340038/webkit-css-pseudo-elements-for-time-field