HTML / CSS LEVEL 2

Teil 3

Absolute Units

px

Pixel, je nach Anzeigegerät

cm, mm

1 cm / mm auf Display
 

in

Zoll, 1in = 2.54cm
 

pc

Picas, 1pc = 12pt = 1/6in

pt

Punkte, 1pt = 1/72i
 

Relative Units

Relativ zur Schriftgrösse

em

Schriftgrößen, 1em = aktuelle Schriftgröße

rem

Die Schriftgröße des Wurzelelements (<html>)

ch

Breite der Null ("0") der aktuellen Schriftart.

ex

Schrifthöhe, 1ex = aktuelle Schrifthöhe

Relative Units

Relativ zum Viewport

vh

1/100 der Viewport Höhe

vw

1/100 der Viewport Breite

vmin

1/100 des kleinstmöglichen Wertes zwischen der Höhe und Breite des Viewports

vmax

1/100 des grösstmöglichen Wertes zwischen der Höhe und Breite des Viewports

Übung mit units

The Percentage %

Immer kontextabhängig

Meistens auf Elternelement bezogen

Übung

Prozente richtig anwenden

Pseudo Elements

:before

:after

<div>

</div>

Ursprünglicher <div> Inhalt

Übung

Pseudo Elemente für grafische Elemente verwenden

Ressourcen

Weitere JSBins

Made with Slides.com