Klasy wyściółki i marginesu w bootstrap 5

Margines i wyściółki to unikalne właściwości CSS, które dodają przestrzenie między pojemnikiem a jego zawartością. Aby uzyskać proste zrozumienie, właściwość Margin dodaje przestrzenie poza pudełkiem, a wyściółka dodaje przestrzenie wewnątrz pudełka.

W tym artykule dowiesz się o

Zajęcia margine-auto
Zajęcia marginesów o rozmiarach
Zajęcia wyściółki o rozmiarach

Warunki stosowane do stosowania marginesu i wyściółki w bootstrap 5

Marginesy i wyściółki można zastosować do elementów HTML za pomocą klas Bootsrap i aby zapewnić odpowiednią klasę, musisz zrozumieć następujące warunki:

M nazywać margines
P Powiedź jako wyściółkę
T Powiedź jako top
B Powiedz się jako dolny
S Powiedź jako Start
mi Powiedź jako koniec

Aby lepiej zrozumieć te warunki, spójrz na następujące przykłady.

Zajęcia margine-auto

Do automatycznego dodawania przestrzeni między elementami kontenera używane są następujące klasy marginesowe.

M-Auto

.M-Auto Klasa daje margines ze wszystkich boków prawej, lewej, górnej i dolnej.

Kod

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

W powyższym przykładzie zastosowaliśmy M-Auto klasa na Orange Div, która dodaje równa przestrzeń z całej strony div.

MS-AUTO

.MS-AUTO klasa dodaje przestrzeń z lewej strony div i SM oznacza margines.

Kod

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

W powyższym przykładzie zastosowaliśmy MS-AUTO klasa na Orange Div, która dodaje przestrzeń z lewej strony div.

Me-Auto

.Me-Auto klasa dodaje przestrzeń z prawej strony div i Ja oznacza margines.

Kod

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

W powyższym przykładzie zastosowaliśmy M-Auto klasa na Orange Div, która dodaje przestrzeń z prawej strony div.

Zajęcia marginesów o rozmiarach

Do dodawania przestrzeni między elementami kontenera używane są następujące klasy marginesowe.

margines

.MT-size Klasa daje margines od górnej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

Ten artykuł dotyczy zajęć z wyściółki i marginesu, aby dać wam szczegółową wiedzę na temat tego, jak dać margines i wyściółkę w bootstrap 5 za pomocą klas.

W powyższym przykładzie

Używanie pomarańczowego pudełka .MT-0 co oznacza brak marginesu od góry
Różowe pudełko używa .MT-1 co oznacza, że margines od góry wynosi 0.25
Używanie niebieskiego pudełka .MT-2 co oznacza, że margines od góry wynosi 0.5
Zielone pudełko używa .MT-3 co oznacza, że margines od góry wynosi 1
Używanie skrzynki skóry .MT-4 co oznacza, że margines od góry wynosi 1.5
Aqua Box używa .MT-5 co oznacza, że margines z góry to 3

-but-ds

.wielkości MB Klasa daje margines od dołu, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

margines start

.ME-size Klasa daje margines od lewej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

End Margin

.ME-size Klasa daje margines od prawej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

Używać .MT-0/1/2/3/4/5 Klasa dla różnych ekranów po prostu używaj .MT-XXL/LG/MD/SM-0/1/2/3/4/5.

Zajęcia wyściółki o rozmiarach

Następujące klasy wyściółki są używane do dodawania przestrzeni między zawartością a kontenerem zgodnie z wymaganiami użytkownika.

Wyściółka

.Pt-size Klasa daje wyściółkę z górnej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

W powyższym przykładzie

Używanie pomarańczowego pudełka .PT-0 co oznacza brak wyściółki z góry
Różowe pudełko używa .PT-1 co oznacza, że wyściółka z góry wynosi 0.25
Używanie niebieskiego pudełka .PT-2 co oznacza, że wyściółka z góry wynosi 0.5
Zielone pudełko używa .PT-3 co oznacza, że wyściółka z góry wynosi 1
Używanie skrzynki skóry .PT-4 co oznacza, że wyściółka z góry wynosi 1.5
Aqua Box używa .PT-5 co oznacza, że wyściółka z góry to 3

Wyściółka

.PB-size Klasa daje wyściółkę z dolnej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

wyściółka start

.PS-size Klasa daje wyściółkę z lewej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

końcówka wyściółka

.rozmiar PE Klasa daje wyściółkę z prawej strony, rozmiar można zastąpić 0/1/2/3/4/4/5.

Kod

Używać .PT-0/1/2/3/4/5 Klasa dla różnych ekranów po prostu używaj .PT-XXL/LG/MD/SM-0/1/2/3/4/5.

Wniosek

Aby uzyskać automatyczne użycie marginesu .MT-AUTO, .MS-AUTO, .Me-Auto zajęcia, aby dać margines zgodnie z użyciem rozmiaru, .MT/B/E/S-0/1/2/3/4/5,i używać klas marginesów o rozmiarach na różnych ekran .MT // B/E/S-XXL/LG/MD/SM-0/1/2/3/4/5. Do wyściółki według rozmiarów .PT/B/E/S-0/1/2/3/4/5 lub jeśli chcesz podać wyściółkę zgodnie z różnymi rozmiarami ekranu .PT // B/E/S-XXL/LG/MD/SM-0/1/2/3/4/5.

c ostre

Jak używać długiego słowa kluczowego w C#

Długie słowo kluczowe w C# może zdefiniować zmienną, która może pomieścić podpisaną wartość całkowit...

Makary Stasiak

Golang

Jakie są stałe w Golang?

W języku Go stałe są zmiennymi o ustalonych wartościach, których nie można zmienić podczas wykonywan...

Larysa Witczak

c ostre

Jaka jest różnica między klasą a obiektem w C#

Klasa to plan lub szablon, który określa cechy i zachowania określonego rodzaju obiektu. Podczas gdy...

Igor Skrzypek