Zusammenfassung neuer Inhalte in HTML5+CSS3

Apropos H5+C3, denken Sie, dass es zu viele Dinge gibt? Heute habe ich eine Zusammenfassung zusammengestellt.

Was sind die CSS3-Selektoren?
Attributselektor, Pseudoklassenselektor, Pseudoelementselektor.

Was sind die neuen Funktionen von CSS3?
1. Farbe: RGBA, HSLA-Modus hinzugefügt
2. Textschatten (Textschatten)
3 >4. Box-Modell: Box-Sizing
5. Hintergrund: Hintergrundgröße Legen Sie die Größe des Hintergrundbilds fest. Hintergrund-Ursprung. Legen Sie den Ursprung des Hintergrundbilds fest.
Hintergrund-Clip Hintergrundbild auf ", „Trennung kann mehrere Hintergründe für adaptives Layout festlegen
6. Übergang: Übergang, Animation kann realisiert werden
9 . Das einzige in CSS3 eingeführte Pseudoelement ist:
10. Medienabfragen, mehrspaltiges Layout
12. y) rotieren(x, y) skew(x, y) skalieren(x, y)
13. 3D-Konvertierung



Was sind die neuen Pseudoklassen in CSS3?

:first-child wählt das erste untergeordnete Element eines Elements aus;
:last-child wählt das letzte untergeordnete Element eines Elements aus; :nth-child(n) wählt ein Element aus spezifischere untergeordnete Elemente eines Elements; Beispiel: p:nth-child(3): Das dritte muss ein p-Element sein, sonst ist es ungültig


:nth-last-child ( ) Wählen Sie ein oder mehrere spezifische Unterelemente eines Elements aus, beginnend mit dem letzten Unterelement dieses Elements
:nth-of-type() Wählen Sie das angegebene Element aus; of-child(3) wählt das dritte p-Element aus

:nth-child(length);/*参数是具体数字*/
:nth-child(n);/*参数是n,n从0开始计算*/ 
:nth-child(n*length)/*n的倍数选择，n从0开始算*/
:nth-child(n+length);/*选择大于length后面的元素*/
:nth-child(-n+length)/*选择小于length前面的元素*/
:nth-child(n*length+1);/*表示隔几选一*/
//上面length为整数
:nth-child(n) //就是所有选择的元素
“n”只能是"n"，不能使用其他字母代替，不然会没有任何效果的。

:nth-last-of-type() wählt das angegebene Element aus, gezählt vom letzten Element

:first-of -type wählt das erste aus; untergeordnetes Element desselben Typs unter einem übergeordneten Element;
: „last-of-type“ wählt das letzte untergeordnete Element desselben Typs unter einem übergeordneten Element aus.
: „only-child“ wählt das Element seines übergeordneten Elements aus. Das einzige Element ;

: only-of-type wählt ein Element aus, das das einzige untergeordnete Element desselben Typs wie sein übergeordnetes Element ist

: empty Es gibt keinen Inhalt im ausgewählten Element
: not () nicht Elemente, die diesem Selektor entsprechen, sind alle Elemente außer einem bestimmten Element
:enabled, :disabled steuern den deaktivierten Status des Formularsteuerelements.
:aktiviert, das Optionsfeld oder Kontrollkästchen ist aktiviert.
::first-line wählt die erste Zeile des Elements aus.
::first-letter wählt den ersten Buchstaben des Textblocks aus.
::before und ::after werden hauptsächlich verwendet, um die Vorderseite des Elements anzugeben Element Oder fügen Sie später Inhalte ein. Der am häufigsten verwendete Inhalt besteht darin, die schwebende
::selection zu löschen, mit der der Standardeffekt der Textauswahl beim Durchsuchen von Webseiten geändert wird 🎜>
Was sind die neuen Funktionen von HTML5? Welche Elemente wurden entfernt? Wie gehe ich mit Browserkompatibilitätsproblemen mit neuen HTML5-Tags um? Wie kann man zwischen HTML und HTML5 unterscheiden?



Neue Funktionen:

1. Drag-and-Drop-API

2. Bessere semantische Inhalts-Tags (Kopfzeile, Navigation, Fußzeile, Seite, Artikel, Abschnitt)

3. Audio-, Video-API (Audio, Video)
5. Lokale Offline-Speicherung localStorage Langzeitspeicherung von Daten, Daten gehen danach nicht verloren Browser wird geschlossen; 7. Sitzungsspeicherdaten werden automatisch gelöscht, nachdem der Browser geschlossen wurde 8. Geolokalisierung



Unterstützt neue HTML5-Tags:

* IE8/IE7/IE6 unterstützt Tags, die von der document.createElement-Methode generiert werden,
Mit dieser Funktion können Sie dafür sorgen, dass diese Browser neue HTML5-Tags unterstützen,
Nachdem der Browser das neue Tag unterstützt, müssen Sie den Standardstil des Tags hinzufügen:
* Natürlich ist es am besten, direkt ein ausgereiftes Framework zu verwenden. Das am häufigsten verwendete ist das HTML5shim-Framework

Das obige ist der detaillierte Inhalt vonZusammenfassung neuer Inhalte in HTML5+CSS3. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!