Przejdź do treści

Atrybuty mieszane marginesu wewnętrznego {padding}

Jak ustawić jednocześnie wszystkie marginesy wewnątrz dowolnego elementu (odstępy): górny, prawy, dolny, lewy?

selektor { padding: wartości atrybutów }
Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów].

Natomiast zasady wpisywania "wartości atrybutów" są takie same jak przy atrybutach mieszanych zwykłego marginesu.

Pozwala wprowadzić jednocześnie kilka wartości marginesów wewnętrznych. Możliwe jest przy tym podanie:

  • jednej wartości - dla wszystkich marginesów wewnętrznych naraz
  • dwóch wartości - osobno kolejno dla marginesów: pionowych i poziomych
  • trzech wartości - pierwsza określa górny margines wewnętrzny, druga - jednocześnie oba poziome (lewy i prawy), a ostatnia - dolny
  • czterech wartości - osobno dla kolejnych marginesów (górny prawy dolny lewy)

Przykład {padding}

Tekst w tej komórce tabeli jest oddalony od wszystkich brzegów obramowania o 1cm (padding: 1cm)

Tekst w tej komórce tabeli jest oddalony od górnego i dolnego brzegu obramowania o 2cm, a od lewego i prawego - o 1cm (padding: 2cm 1cm)

Tekst w tej komórce tabeli jest oddalony od górnego brzegu obramowania o 2cm, od lewego i prawego - o 1cm, a od dolnego - o 3cm (padding: 2cm 1cm 3cm)

Tekst w tej komórce tabeli ma następujące marginesy wewnętrzne: górny 2cm, prawy 5mm, dolny 3cm, lewy 1cm (padding: 2cm 5mm 3cm 1cm)

Pytania i odpowiedzi {padding}

Co to jest "padding"?

padding to właściwość w CSS, która określa odstęp pomiędzy zawartością elementu a jego obramowaniem. Oznacza to przestrzeń wewnątrz elementu, pomiędzy treścią a jego obramowaniem. Na przykład: "padding: 10px" dodaje 10 pikseli odstępu wewnątrz elementu, oddzielając treść od obramowania.

Jaka jest różnica między "padding" a "margin"?

Różnica między padding a margin polega na ich funkcji i wpływie na układ elementów. margin tworzy odstęp zewnętrzny między elementem a jego otoczeniem, oddzielając go od innych elementów. Z kolei padding tworzy odstęp wewnętrzny pomiędzy zawartością elementu a jego obramowaniem, oddzielając treść od obramowania. Innymi słowy, margin wpływa na odstępy między elementami, natomiast padding kontroluje odstępy wewnątrz elementu.

Jak ustawić margines wewnętrzny?

Aby ustawić margines wewnętrzny, czyli odstęp wewnątrz elementu, użyj właściwości padding i określ wartości dla górnej, prawej, dolnej i lewej strony marginesu wewnętrznego. Na przykład: "padding: 15px 20px 15px 20px" ustawia margines wewnętrzny o wymiarach 15 pikseli na górze i na dole oraz 20 pikseli po prawej i lewej stronie elementu.

Przeglądarki


Chrome

Firefox

Edge

Opera

Safari
padding: wartość1
2008-12-11
1
2004-11-09
12
2015-07-29
3.5
1998-11-18
1
2003-06-23

Komentarze

Zobacz więcej komentarzy

Facebook