Atrybut CSS margin-block-end

Poprzednia strona margin-block
Następna strona margin-block-start

Definicja i użycie

margin-block-end atrybut określa margines końcowy kierunku blokowego.

CSS margin-block i margin-inline atrybuty są podobne do atrybutów CSS margin-top,margin-bottom,margin-left i margin-right jest bardzo podobny, ale margin-block i margin-inline Atrybut zależy od kierunku blokowego i kierunku wiersza.

Uwaga:powiązane atrybuty CSS writing-mode Definiuje kierunek blokowy. To wpływa na pozycję początkową i końcową bloku oraz margin-block-end Wynik atrybutu. Dla stron w języku angielskim, kierunek blokowy jest w dół, a kierunek wiersza od lewej do prawej.

Przykład

Przykład 1

Ustawienie marginesu zewnętrznego w kierunku końcowym bloku:

div {
  margin-block-end: 35px;
}

Spróbuj sam

Przykład 2

Kiedy element <div> writing-mode Kiedy atrybut wartości ustawiony jest na vertical-rl, kierunek blokowy jest od prawej do lewej. W rezultacie, pozycja końcowa elementu przenosi się z dołu na lewo. Zmiana writing-mode wpływa również na efekt margin-block-end:

#parentDiv {
  writing-mode: vertical-rl;
}
#myDiv {
  margin-block-end: 50px;
}

Spróbuj sam

Gramatyka CSS

margin-block-end: auto|length|initial|inherit;

Wartość atrybutu

Wartość	Opis
auto	Domyślna wartość. Domyślna margines zewnętrzny elementu.
length	Określa odległość, jednostką px, pt, cm itp. Dopuszczalne są wartości ujemne. Zobacz:Jednostki CSS.
%	Określa odległość względem rozmiaru elementu nadrzędnego w kierunku wiersza jako procent.
initial	Ustawia tę właściwość na jej wartość domyślną. Zobacz: initial.
inherit	Dochodzi do tej właściwości od elementu nadrzędnego. Zobacz: inherit.

Szczegóły techniczne

Domyślna wartość:	auto
Inheredność:	Nie
Tworzenie animacji:	Wspierane. Zobacz:Atrybuty animacji.
Wersja:	CSS3
Gramatyka JavaScript:	object.style.marginBlockEnd="20px"