CSS
inline (auf dem Etikett in der Eigenschaft geschrieben)
Embedded (mit)
Outreach (CSS - Datei einzuführen)
Die Priorität ist das Prinzip der Nähe: Inline höher Embedded als Outreach
(Klasse kann mehr) mit .p Anruf
(Id nur eine) Anruf mit #P
pseudo-Objekt
css im Wesentlichen Selektor
alle Elemente auswählen
Stilelemente: *} {
Die Elementtyp Auswahl
Stilelemente: {A}
Körperelemente: Fliegenschule
Die Klasse Elemente ausgewählt
Stilelemente: {} .class1
Körperelemente:
Fly
Die ID - Element , ausgewählt
Stilelemente: ID1 # {}
Körperelemente:
Fly
Das Attribut Element ausgewählt
Stilelement: [Herf] {}
Körperelemente: Fliege
Action - Selektor
Stilelemente: a: Hover {} Wenn die Maus über
das Körperelement: Fliege
Erstellen Rand und Hintergrund
Grenze - Attribut
Hintergrund Eigenschaft
border-radius: 10px / 10px; ( Radius horizontal / vertikalen Radius)
CSS eingestellt den Textstil
text-align: center; mittlere
Richtung: rtl, rechts Schnapp
(RNL und LTR) von rechts nach links
Zeichenabstand: 10px; letter-spacing
Wortabstand: 10px; Wortabstand
line-height: 10px; line der Abstand zwischen der (hohen Linie)
textGedankenStrich: 50 Pixel; Erstzeileneinzug
Text-Dekoration: Unterstreichungs; text-Dekoration
(gemeinsame Attribute line-through Oberlinie unterstrichen)
Text-transform : nutzen, die ersten Buchstaben jedes Wortes in nutzen
text-trans : Groß, all Groß
text-transform : Klein, alles Klein
font-family: in bold; Schriftnamen
font-size: 40px; font size
font-style: italic; font kursiv
font-variant: small-caps; Schriftarten Kapitälchen Anzeige
font-Gewicht: 900; fetter Schrift
text-shadow: 1px 10px 10px rot ; ( Parameter sind horizontal versetzt sind , vertikal versetzt sind , (blur), Farbe)
CSS mit einem Übergang
P {
Breite: 100 Pixel; (breit)
Höhe: 100 Pixel; (high)
Hintergrund-Farbe: AntiqueWhite;
}
P: Hover {(wenn der Mauszeiger gibt)
Breite: 200 Pixel; (breit)
Höhe: 200 Pixel, (hoch)
Farbhintergrund: White;
Gangs delay: 150 ms; (delay)
Übergang DAUER: 500 ms; (transient Änderungszeit)
Übergangs-Eigenschaft: farb Hintergrund; (Farbe nur durch die vorangehenden Verzögerungssteuerattribute beschränkt ist)
Übergang Timing- Funktion: Leichtigkeit, (sowie Einfachheit in, Leichtigkeit-out, Leichtigkeit-in-out, linear) Geschwindigkeit Umwandlung Animation
}
EASE EASE EASE-in-in-EASE-oUT oUT
Animation erstellen
P {
width: 100px;
height: 100px;
background-color: AntiqueWhite;
}
P: Hover {
Animations-Verzögerung: 200ms;
Animations-DAUER: lS,
Animation , Name: XX;
Animations-Iteration-COUNT: Unendliche; ( Endlosschleife)
animationsRichtung: Alternate; (vorwärts erster zweiter dritter Rückwärtslauf Vorwärtslauf laufen ...)
}
@keyframes XX {(key frames)
von {(ersten)
Breite: 100 Pixel;
Höhe: 100px;
Hintergrund-Farbe: Weiß;
}
50% {
width: von 150px;
height: von 150px;
Hintergrund-Farbe: Gelb;
}
zu {(letztmalig)
Breite: 200px;
height: 200px;
Hintergrund-Farbe: Schwarz;
}
}
Transformation unter Verwendung von
P {
Breite: 100 Pixel;
Höhe: 100 Pixel;
Hintergrund-Farbe: AntiqueWhite;
}
P: Hover {
Breite: 100 Pixel;
Höhe: 100 Pixel;
Hintergrund-Farbe: AntiqueWhite;
Transformations: Drehen (30deg); (im Uhrzeigersinn in Grafikzentrum 30 Grad Rotation)
Transformations-Herkunft: oben rechts, (angeordnete Rotationszentrum)
umwandeln: Skala (1,5); (Skalierung Grafiken vier Wochen)
umwandeln:. scaleX (5), (vergrößert in der x-Richtung)
}
Zusatz:
Opazität Opazität
Animation-Füll-Modus: vorwärts; ( Animation wird nicht in seine ursprüngliche Form zurück)
