CSS Positions in unter 3 Minuten | Tutorial Deutsch

preview_player
Показать описание
Mit dem Coupon-Code: KURZUNDKNAPP
sparst du 10% Rabatt auf alle Webhosting-Pakete mit einer Laufzeit von 12 Monaten und mehr.

Die Positions Eigenschaft kann 5 verschiedene Werte annehmen:
static, relative, fixed, sticky und absolute. Diese fünf werden in diesem Video genauer erklärt.

00:00 Grundlagen
00:24 relative
00:55 fixed
01:15 sticky
01:40 absolute

static:
Default Position eines HTML-Elements.

relative:
Ein relative-positioniertes Element kann mit den Eigenschaften top, left, right und bottom relativ zu seiner Ursprungsposition positioniert werden.

fixed:
Ein fixed-Element orientiert sich am Anzeigebereich. Es ist auf eine Position im Bildschirm fixiert. Sogar wenn der User scrollt, folgt das fixed-Element, um auf der festgelegten Position zu bleiben.

sticky:
Sticky ist eine Mischung aus relative und fixed. Ein sticky-Element ist zuerst relative positioniert. Sobald der User eine gewisse Scrollposition erreicht hat, wird es zu einem fixed Element.
Рекомендации по теме
Комментарии
Автор

Super Videos! Minimalistisch und kurz auf den Punkt gebracht. Wenn jedes Tutorial so wäre...

Use Case für "postion: sticky": Nützlich, wenn man eine Tabelle hat, die sich über die Bildschirmhöhe hinaus erstreckt, man aber trotzdem jederzeit die Kopfspalte sehen möchte, während die Tabelle im Viewport ist.

Max-jrrx
Автор

Also besser kann man es echt nicht erklären, top!

skyliferoleplay
Автор

Könntest du mal ganze Grundkurs hochladen?

vcemo
Автор

Hallo! Mir gefallen Eure sehr informativen Kurzvideos. Zu diesem hier habe ich eine Frage: Gegen Ende wird die Wechselbeziehung der Attribute Relative und Absolute beschrieben. Verstehe ich das richtig? Bei den anderen Attributen (Fixed und Sticky) bestehen keine solchen Wechselbeziehungen?

andreask.