Heim > Web-Frontend > CSS-Tutorial > Eigenschaften und Implementierungsmethoden des Übergangs in CSS

Eigenschaften und Implementierungsmethoden des Übergangs in CSS

不言
Freigeben: 2018-08-21 09:27:42
Original
3883 Leute haben es durchsucht

Der Inhalt dieses Artikels befasst sich mit den Attributen und Implementierungsmethoden in CSS. Er hat einen gewissen Referenzwert. Ich hoffe, dass er für Sie hilfreich ist.

Hinweis: IE9 und frühere IE-Versionen unterstützen keinen Übergang! Um das Safari-Verkehrsgerät zu schreiben, müssen Sie das Präfix -webkit- usw. hinzufügen!

1. Übergang bedeutet, dass, wenn die Maus über ein bestimmtes Element bewegt wird, dieses von einem Stil zum anderen wechseln kann.

2. Implementierungsmethode:

1. Geben Sie den Stil an

.panel:target{
	margin-top: 0%;
	background-color: #ffcb00;
}
Nach dem Login kopieren

2. Geben Sie die Effektdauer an (die Standardeinstellung). time ist Null, wenn nicht angegeben, hat es keine Auswirkung.

3. Syntax: Eigenschaftsdauer-Timing-Funktionsverzögerung

Analysieren Sie jede Eigenschaftsschreibmethode Element für Element:

1. Übergangseigenschaft (angeben). CSS-Eigenschaften)

: keine (keine Eigenschaften erhalten den Übergangseffekt); alle (Standardeinstellung, alle Eigenschaften erhalten die Übergangseffekt-Eigenschaft (eine durch Kommas getrennte Liste von CSS-Eigenschaftsnamen, die den Anwendungsübergangseffekt definieren);

2. Übergangsdauer (gibt die Zeit an, die zum Abschluss des Übergangseffekts benötigt wird)

:time (gibt die Zeit an, die zum Abschluss des Übergangseffekts benötigt wird, der Standardwert ist 0); 🎜>3. Übergangs-Timing-Funktion (gibt die Geschwindigkeit des Umschalteffekts an)

: linear (gibt einen Übergangseffekt an, der mit der gleichen Geschwindigkeit beginnt und endet) (Standard, gibt a an); Übergangseffekt, der langsam beginnt, dann schneller wird und dann langsam endet); Ease-in (gibt einen Übergangseffekt an, der mit langsamer Geschwindigkeit beginnt); in-out (gibt einen Übergangseffekt an, der mit langsamer Geschwindigkeit beginnt und endet); Kubik-Bezier (n,n,n,n) (definieren Sie Ihren eigenen Wert in der Kubik-Bezier-Funktion, die einzigen möglichen Werte liegen dazwischen 0-1)

4. Übergangsverzögerung (geben Sie an, wann der Umschalteffekt beginnt)

:Zeit (geben Sie die Anzahl der Sekunden oder Millisekunden an, die gewartet werden soll, bevor der Umschalteffekt beginnt, die Standardeinstellung Wert ist 0)

Verwandte Empfehlungen:

background-orgin in css3 Verwendung (mit Code)

Verwendung von opacity-Attribut zum Hinzufügen von Transparenz zu einem Hintergrundbild in CSS (Code)

Das obige ist der detaillierte Inhalt vonEigenschaften und Implementierungsmethoden des Übergangs in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage