CSS Referenz: Darstellung

0 | 12159 Aufrufe
Sie können diese Wikiseite nach der Anmeldung auf Webmasterpro bearbeiten. Helfen Sie mit und verbessern Sie "CSS Referenz: Darstellung" mit Ihrem Wissen!

Anzeige Hier werben

Einleitung Boxmodel ...

display: Anzeige von Elementen

Firefox3.6Unterstützt4+Unterstützt
IE7Fast8Fast9Unbekannt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
display

Werte: none, block, inline, inline-block, list-item, run-in, table, inline-table, ...

visibility: Sichtbarkeit von Elementen

Firefox3.6Unterstützt4+Unterstützt
IE7Unterstützt8Unterstützt9Unterstützt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
visibility

Werte: visible, hidden, collapse

visibility steht für die Sichtbarkeit. visibility: visible zeigt etwas an, visibility: hidden zeigt etwas nicht an. Im Gegensatz zu display: none, wird bei visibility: hidden der Platz für das Element frei gehalten.

Breite/Höhe

Firefox3.6Unterstützt4+Unterstützt
IE7Unterstützt8Unterstützt9Unterstützt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
height/width

...

width: Elementbreite

...

height: Elementhöhe

...

min-width/max-width: Mindestbreite/Maximalbreite

...

min-height/max-height: Mindesthöhe/Maximalhöhe

...

overflow: Behandlung von übergroßem Inhalt

Firefox3.6Unterstützt4+Unterstützt
IE7Unterstützt8Unterstützt9Unterstützt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
overflow

Werte: auto, hidden, scroll, visible

Bei Boxen und Tabellenzellen mit einer festgelegten Größe (height / width) kann es vorkommen, dass ein Text oder anderer Inhalt in diesem Element mehr Raum einnimmt, als das Element bieten kann. Durch die Eigenschaft overflow besteht die Möglichkeit in CSS zu definieren, wie dieser übergroße Inhalt behandelt werden soll.

overflow-x/overflow-y

Firefox3.6Unterstützt4+Unterstützt
IE7Unterstützt8Unterstützt9Unterstützt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
overflow-x/overflow-y

Mit overflow-x und overflow-y kann horizonal und vertikal überfließender Inhalt verschieden behandelt werden. Somit ist es z.B. möglich nur in einer Richtung eine Scrolleiste anzuzeigen.

opacity: Deckkraft/Transparenz von Elementen

Firefox3.6Unbekannt4+Unterstützt
IE7Fast8Fast9Unbekannt
Opera11Unbekannt12Unbekannt
1+Unterstützt
Safari4Unterstützt5Unterstützt
opacity

Mit der opacity Eigenschaft kann die Deckkraft/Transparenz von Elementen gesteuert werden. Diese Eigenschaft wird zwar so nicht im Internet Explorer unterstützt, es gibt aber eine ebenbürtige Eigenschaft, wodurch in allen Browsern Transparenz genutzt werden kann.

clip: nur Ausschnitt anzeigen

Werte: rect(oben recht unten links)

Firefox3.6Unterstützt4+Unterstützt
IE7Unterstützt8Unterstützt9Unterstützt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
clip

Mit clip kann man eine rechteckige Maske über ein Element legen: Alles was nicht in diesem Rechteck ist, wird ausgeblendet.

box-sizing: Einstellunen auf was sich die Angabe der Breite und Höhe bezieht

Firefox3.6Unterstützt4+Unterstützt
IE7Nein8Unterstützt9Unterstützt
Opera11Unterstützt12Unterstützt
1+Unterstützt
Safari4Unterstützt5Unterstützt
box-sizing

Werte: border-box, conten-box, padding-box

Einstellung auf was sich die Angabe der Breite und Höhe bezieht (auf den Inhalt oder auf den Inhalt + Innenabstand, ...)


Wikiseite bearbeiten

Diese Seite kann von jedem registrierten Benutzer bearbeitet werden. Bisher haben 8 Personen an der Seite "CSS Referenz: Darstellung" mitgewirkt.

Sie haben einen Fehler entdeckt oder möchten etwas ergänzen? Dann können Sie nach der Anmeldung "CSS Referenz: Darstellung" hier bearbeiten.