Allgemeine CSS-Tags

Gemeinsame CSS-Tags

Ein CSS-Textattribut

Farbe: #999999; /*Textfarbe*/

Schriftfamilie: 宋体,sans-serif; /*Textschriftart*/

Schriftgröße: 9pt; /*Textgröße*/

font-style:itelic; /*kursiver Text*/

font-variant:small-caps; /*kleine Schriftart*/

Buchstabenabstand: 1pt; /*Leerzeichen zwischen Buchstaben*/

Zeilenhöhe: 200 %; /*Zeilenhöhe festlegen*/

font-weight:bold; /*Text fett*/

vertikal-align:sub; /*subscript*/

vertikal-align:super; /*superscript*/

text-decoration:line-through; /*Durchgestrichen hinzufügen*/

text-decoration: overline; /*Obere Zeile hinzufügen*/

text-decoration:underline; /*underline*/

text-decoration:none; /*Keine Dekorationszeile*/

text-transform : großschreiben; /*Das erste Wort groß schreiben*/

text-transform : Großbuchstaben; /*Englischer Großbuchstaben*/

text-transform : Kleinbuchstaben; /*Englischer Kleinbuchstabe*/

text-align:right; /*Text rechts ausrichten*/

text-align:left; /*text linksbündig*/

text-align:center; /*Text-zentriert ausgerichtet*/

text-align:justify; /*Text-aligned*/

vertical-align:top; /*Die Oberseite des größten Elements innerhalb der Elementreihe vertikal ausrichten/

vertical-align:bottom; /*Die Unterseite des größten Elements innerhalb der Elementreihe vertikal ausrichten*/

vertikal-align:middle; /*Vertikale zentrierte Ausrichtung*/

vertical-align:text-top; /*Die Oberseite des übergeordneten Elements vertikal ausrichten*/

vertical-align:text-bottom; /*Die Unterseite des übergeordneten Elements vertikal ausrichten*/

Der Unterschied zwischen oben, unten, Text-oben und Text-unten:

2. CSS-Rand leer

padding-top:10px; /*Oberen Rand leer lassen*/

padding-right:10px; /*Rechten Rand leer lassen*/

padding-bottom:10px; /*Unteren Rand leer lassen*/

padding-left:10px; /*Den linken Rand leer lassen

3. CSS-Symbolattribute

list-style-type:none; /*Keine Markierung*/

list-style-type:decimal; /*Arabische Ziffernmarkierung*/

list-style-type:lower-roman; /*Kleine römische Ziffern, wie zum Beispiel: i, ii, iii, iv, v usw.*/

list-style-type:upper-roman; /*Große römische Ziffern, wie zum Beispiel: I, II, III, IV, V usw.*/

list-style-type:lower-alpha; /*kleine englische Buchstabenmarkierung*/

list-style-type:upper-alpha; /*große englische Buchstabenmarkierung*/

list-style-type:disc; /*durchgezogene Kreismarkierung*/

list-style-type:circle; /*Hohle Kreismarkierung*/

list-style-type:square; /*Volle quadratische Markierung*/

list-style-image:url(/dot.gif); /*Benutzerdefiniertes Bild-Tag*/

list-style-position: Outside; /*convex row*/

list-style-position:inside; /*indent*/

4. CSS-Hintergrundstil

/*Hintergrundfarbe*/

Hintergrund:transparent; /*Perspektivischer Hintergrund*/

Hintergrundbild: url(/image/bg.gif); /*Hintergrundbild*/

Hintergrundanhang: behoben; /*Wasserzeichen behobener Hintergrund*/

Hintergrundwiederholung: wiederholen; /*Anordnung wiederholen – Webseitenstandard*/

Hintergrundwiederholung: keine Wiederholung; /*Keine Wiederholungsanordnung*/

Hintergrundwiederholung: Wiederholung-x; /*auf der X-Achse wiederholen*/

Hintergrundwiederholung: Wiederholung-y; /*auf der Y-Achse wiederholen*/

Hintergrundposition angeben

background-position : x% y%; /*Die Position der x- und y-Achse des Hintergrundbildes*/

Hintergrundposition: oben; /*nach oben ausrichten*/

background-position : buttom; /*nach unten ausrichten*/

Hintergrundposition: links; /*Links ausrichten*/

Hintergrundposition: rechts; /*Rechts ausrichten*/

Hintergrundposition: Mitte; /*Mitte ausgerichtet*/

5. CSS-Verbindungseigenschaften

a /*Alle Hyperlinks*/

a:link /*Hyperlink-Textformat*/

a:visited /*Linktextformat besucht*/

a:active /*Format des gedrückten Links*/

a:hover /*mouse to link*/

Mauszeigerstil:

Verbotener Cursor:nicht zulässig;

Link-Finger-Cursor: Zeiger

Fadenkreuz-Cursor:Fadenkreuz

Hilfe-Cursor (es wird ein Fragezeichen angezeigt) Cursor:Hilfe

Kreuzpfeil-Cursor:bewegen

Text T-förmiger Cursor:Text

Hintergrundprogramm läuft vom Typ Cursor:Fortschritt

Trichtercursor:warten

Der Pfeil zeigt nach rechts oder nach rechts, Cursor:w-resize oder Cursor:e-resize

Pfeil nach oben oder unten Cursor:n-resize oder Cursor:s-resize

/*Diese vier Werte entsprechen den Anfangsbuchstaben der englischen Buchstaben „Southeast“, „Northwest“ und „Northwest“ bzw. */

Der Pfeil zeigt auf den oberen oder unteren rechten Cursor:ne-resize oder Cursor:se-resize

Der Pfeil zeigt auf den Cursor oben links oder unten links: Cursor:nw-resize oder Cursor:sw-resize

/*Der erste Buchstabe dieser vier Werte ist der erste Buchstabe von Norden oder Süden*/

Benutzerdefinierter Cursor p {cursor:url("cursor file name.ico"),text;}

/*Benutzerdefinierte Cursor sind anfällig für Inkompatibilitätsprobleme, daher müssen Sie einen Standard-Cursortyp hinzufügen*/

6. Liste der CSS-Frames

border-top : 1px solid #6699cc; /*top border*/

border-bottom : 1px solid #6699cc; /*bottom border*/

border-left : 1px solid #6699cc; /*left border*/

border-right : 1px solid #6699cc; /*right border*/

Das Obige ist die empfohlene Schreibmethode, Sie können jedoch auch die herkömmliche Methode wie folgt verwenden:

border-top-color: #369 /*Legen Sie die obere Farbe der Randlinie fest*/

border-top-width:1px /*Legen Sie die obere Breite des oberen Randes fest*/

border-top-style: solid/*Legen Sie den oberen Stil der Randlinie fest*/

Andere Randstile

solider /*solider Rahmen*/

gepunktet /*gepunktetes Kästchen*/

doppelter /*doppelter Rahmen*/

Nut /*Dreidimensionaler innerer konvexer Rahmen*/

Grat /*dreidimensionaler Reliefrahmen*/

Einsatz /*konkaver Rahmen*/

Anfang /*konvexer Rahmen*/

7. CSS-Randstil

margin-top:10px; /*oberer Rand*/

margin-right:10px; /*rechter Randwert*/

margin-bottom:10px; /*unterer Randwert*/

margin-left:10px; /*linker Randwert*/

8. Häufig verwendete CSS-Kombinationen

myCSS1{display:block; margin: 0px; padding: 0px; wrap;">#ddd;padding:50px;Schriftgröße: 30px;}