CSS: Padding erstellen – CSS Kurs

Ein Padding in CSS ist ein definierter Abstand um das Element in Pixel oder in Prozent

So erstellst du Padding in CSS:

Die CSS-Eigenschaft padding definiert den Abstand zwischen dem Inhalt eines Elements und seinem Rahmen.

1. Alle Seiten gleichzeitig:

padding: wert;

Beispiel:

padding: 20px; /* Fügt 20 Pixel Padding auf allen Seiten hinzu */

Einzelne Seiten:

padding-top: wert;
padding-right: wert;
padding-bottom: wert;
padding-left: wert;

Beispiel:

padding-top: 10px; /* 10 Pixel Padding oben */
padding-right: 20px; /* 20 Pixel Padding rechts */
padding-bottom: 30px; /* 30 Pixel Padding unten */
padding-left: 40px; /* 40 Pixel Padding links */

Abkürzungen:

padding: oben-unten rechts-links;

Beispiel:

padding: 15px 25px; /* 15 Pixel Padding oben und unten, 25 Pixel Padding rechts und links */

Prozentangaben:

padding: prozentwert;

Beispiel:

padding: 5%; /* Fügt 5% des übergeordneten Elements als Padding hinzu */

Erklärung:

• Der Wert für padding kann in Pixeln, Prozenten oder anderen Maßeinheiten angegeben werden.
• Prozentangaben beziehen sich auf die Größe des übergeordneten Elements.
• Wenn du nur einen Wert angibst, wird dieser gleichmäßig auf alle Seiten angewendet.
• Mit der zweiten Syntax kannst du die Padding-Werte für jede Seite einzeln festlegen.

Zusätzliche Informationen:

• Padding wird zur Breite und Höhe des Elements addiert.
• Um den Abstand zwischen Elementen zu vergrößern, verwende die CSS-Eigenschaft margin.
• Achte auf die Konsistenz in deinem CSS-Code, um ein einheitliches Erscheinungsbild zu gewährleisten.

Über mich

Domi

Hi ich bin’s Dominik. Auf Blogseite.com findest du alles was mich interessiert. Mag Games, liebe SEO, programmiere gerne und möchte dir mit verschiedenen Themen die mich begeistern einen Mehrwert liefern. Viel Spaß auf meiner Seite