Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Warum unterstützen Eingabeelemente ::before und ::after Pseudoelemente nicht?

Barbara Streisand
Freigeben: 2024-10-24 18:12:14
Original
602 Leute haben es durchsucht

Why Don't Input Elements Support ::before and ::after Pseudo-Elements?

Das Rätsel lösen: Warum Eingabeelemente ::before und ::after Pseudoelemente fehlen

In dem Bestreben, das Standard-Styling für zu verbessern Bei HTML5-Eingabeelementen tritt häufig das Problem auf, dass ::after-Pseudoelemente den Inhalt nicht rendern können. Trotz zahlreicher Versuche und Tests in verschiedenen Browsern sind die gewünschten visuellen Verbesserungen immer noch nicht erreichbar.

Dieses eigenartige Verhalten hat Neugier geweckt: Warum lehnen Browser ::after-Pseudoelemente auf Eingabeelementen einstimmig ab? Eine gründliche Untersuchung der CSS-Spezifikation bringt ein entscheidendes Detail ans Licht. Gemäß der CSS21-Spezifikation gilt ::after nur für Elemente, die über Dokumentbauminhalte verfügen. Eingabeelemente sowie Elemente wie Bilder und Zeilenumbrüche enthalten keinen solchen Inhalt, sodass die Verwendung von ::after unwirksam ist.

Daher liegt die Antwort in der Natur der Eingabeelemente. Im Gegensatz zu Elementen wie Absätzen oder Abschnitten, die Textinhalte enthalten, erleichtern Eingabeelemente in erster Linie die Benutzerinteraktion und enthalten keinen Inhalt für Anzeigezwecke. Diese inhärente Eigenschaft verhindert die Verwendung von ::before- und ::after-Pseudoelementen auf Eingabeelementen.

Das obige ist der detaillierte Inhalt vonWarum unterstützen Eingabeelemente ::before und ::after Pseudoelemente nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!