Aktionen

CSS - Alles rund um Text

Aus znilwiki

Habe ich hier hauptsächlich als eigenes Nachschlagewerk aufgeführt - die Sachen werden gebraucht um das design dieser Webseite anzupassen.

font

Schrifarten:

  • font-family:
    • "Name der Schriftart" - z.B. "Times New Roman"
    • Teil des Namens - z.B. Times
    • Schriftartenfamilie
      • Serif - z.B. Times New Roman
      • San-serif - z.B. Arial
      • Monospace - Consolenschriftarten, z.B. Courier New
font-family:"Times New Roman", Times, serif;


Stil (normal oder italic

  • font-style:
    • normal - ja- normal halt
    • italic - Schräge Schrift
font-style: normal;


Stil (fett etc.)

  • font-weight:
    • normal
    • bold -> fett
    • bolder -> extra fett
    • lighter -> Dünner als normal
    • 100, 200, 300, 400, 500, 600, 700, 800, 900 -> wobei 400 normal sein sollte und 700 bold
font-weight: bold;


Stil (Unterstreichen etc.)

  • text-decoration:
    • normal
    • underline - unterstrichen
    • overline - Linie über dem Text
    • line-through - durchgestrichen
text-decoration:underline;
text-decoration:line-through;


Größe

  • font-size:
    • in Pixel, z.B. 20px
    • in "em", z.B. 2em (wobei 1em der normalen Schriftgröße entsprechen soll, 1em sollten 16px sein)
    • in %, z.B. 100%
font-size: 2em;


Farbe

  • color:
    • Farbwert als Hexadezimal: ##ffffff ist weiss, #000000 ist schwarz
    • Farbenname, z.B. red, black, white, grey, lightgrey
color: #fc0000;
color: white;


Ausrichtung

  • text-align:
    • left = links
    • center = zentriert
    • right = rechts
    • justify = Blocksatz
text-align: center;
text-align: left;
text-align: right;
text-align: justify;


Umwandeln (GROSS/klein)

  • text-transform:
    • none
    • capitalize - erster Buchstabe groß, Rest klein
    • uppercase - alles in GROSSBUCHSTABEN
    • lowercase - alles in kleinbuchstaben
text-transform: uppercase;
text-transform: lowercase;
text-transform: capitalize;

Einzug (~TAB)

  • text-indent:
    • Wert in px, em oder % -> gibt den Abstand zum eigentlichen Textrand an, so ähnlich wie TAB. Die umgebrochenen Zeilen fangen aber wieder normal an.
text-indent:20px



Abgerufen von „https://znil.net/index.php?title=CSS_-_Alles_rund_um_Text&oldid=3419“