Enthüllung des Rätsels der Kombination herstellerspezifischer Selektoren
Im Bereich CSS stößt man auf das Rätsel, Platzhaltertext in mehreren Browsern zu formatieren . Um eine optimale browserübergreifende Unterstützung zu erreichen, wird eine Kombination aus herstellerspezifischen Pseudoklassen und Pseudoelementen verwendet. Es gibt jedoch ein verwirrendes Dilemma: Warum ist es nicht möglich, diese in einem einzigen Regelsatz zusammenzuführen, wie es in anderen CSS-Szenarien üblich ist?
Wenn man in die Tiefen der CSS2.1-Spezifikationen eintaucht, findet man die Antwort. Es schreibt vor, dass ein Selektor als alles definiert ist, was zur ersten linken geschweiften Klammer ({) führt. Wenn ein Benutzeragent auf einen Selektor trifft, den er nicht entschlüsseln kann, muss er sowohl den Selektor als auch den darauffolgenden Deklarationsblock ignorieren.
Dies hat zur Folge, dass Browser mit bestimmten Präfixen die Selektoren mit anderen herstellerspezifischen Präfixen möglicherweise nicht verstehen , was zum Ausschluss von Regeln führt, die diese nicht erkannten Präfixe in Selektoren erwähnen. Folglich werden sich Versuche, diese Regeln in einem einzigen, durch Kommas getrennten Regelsatz zu kombinieren, wie folgt:
input:-moz-placeholder, input::-moz-placeholder, input:-ms-input-placeholder, input::-webkit-input-placeholder { font-style: italic; text-align: right; }
, als erfolglos erweisen. Der Benutzeragent wendet die Stile nur auf den erkannten Selektor an, was zu inkonsistenten Stilen in allen Browsern führt.
Diese komplizierte Regel erfüllt einen Zweck. Dadurch wird sichergestellt, dass Browser die anerkannte CSS-Syntax einhalten und nur Regeln implementieren, die sie vollständig verstehen. Durch die Durchsetzung werden mögliche Inkonsistenzen oder Darstellungsfehler aufgrund herstellerspezifischer Abweichungen vermieden.
Das obige ist der detaillierte Inhalt vonWarum können wir herstellerspezifische Platzhalterselektoren nicht in einer einzigen CSS-Regel kombinieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!