Wie verstecke ich den Standard-Platzhaltertext im „Element' von HTML5?

So entfernen Sie den Standard-Platzhaltertext aus HTML5s Element

Wenn Sie das HTML5-Eingabeelement mit dem auf „Datum“ eingestellten Typ verwenden, zeigt das Element automatisch ein Standarddatumsformat (MM/TT/JJJJ) als Platzhalter an. Dieser Platzhaltertext kann in bestimmten Situationen ein Hindernis darstellen.

Um diesen Standardtext zu entfernen, vermeiden Sie die Verwendung der folgenden Stylesheet-Regel, da dadurch der ausgewählte Datumswert verdeckt wird:

input[type=date]::-webkit-datetime-edit-text {
    -webkit-appearance: none;
    display: none;
}
input[type=date]::-webkit-datetime-edit-month-field{
    -webkit-appearance: none;
    display: none;
}
input[type=date]::-webkit-datetime-edit-day-field {
    -webkit-appearance: none;
    display: none;
}
input[type=date]::-webkit-datetime-edit-year-field {
    -webkit-appearance: none;
    display: none;
}

Stattdessen Verwenden Sie die folgende CSS-Regel, um Platzhaltertext auszublenden, ohne den ausgewählten Datumswert zu beeinflussen:

::-webkit-datetime-edit-year-field:not([aria-valuenow]),
::-webkit-datetime-edit-month-field:not([aria-valuenow]),
::-webkit-datetime-edit-day-field:not([aria-valuenow]) {
    color: transparent;
}

Diese Regel zielt auf die Felder Jahr, Monat und Tag des Datumseingabeelements ab und setzt deren Farbe auf transparent, wenn dies der Fall ist kein „aria-valuenow“-Attribut haben. Dadurch wird der Platzhaltertext unsichtbar, während das ausgewählte Datum sichtbar bleibt.

Das obige ist der detaillierte Inhalt vonWie verstecke ich den Standard-Platzhaltertext im „Element' von HTML5?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!