Atrybut CSS inset-inline-start

定义和用法

inset-inline-start definicję i użycie

Uwaga:Atrybut określa odległość początkowego końca elementu w kierunku wiersza od elementu nadrzędnego. Aby atrybut ten działał, musisz指定 position

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

Uwaga:powiązane atrybuty CSS writing-mode i direction Definiuje kierunek wiersza. To wpływa na początkową pozycję elementu w kierunku wiersza oraz inset-inline-start Wynik atrybutu. Dla stron w języku angielskim, kierunek wiersza to od lewej do prawej, a kierunek blokowy to w dół.

Przykład

Przykład 1

Ustawienie odległości między początkiem umieszczonego <div> elementu w kierunku wiersza a elementem nadrzędnym:

div {
  inset-inline-start: 50px;
}

Spróbuj sam

Przykład 2

Kiedy atrybut <div> elementu writing-mode Kiedy wartość atrybutu ustawiona jest na vertical-rl, kierunek wiersza to w dół. Wynik to, że początek elementu przenosi się z lewej strony na górę:

div {
  inset-inline-start: 50px;
  writing-mode: vertical-rl;
}

Spróbuj sam

Przykład 3

Kiedy atrybut <div> elementu direction Kiedy wartość atrybutu ustawiona jest na rtl, kierunek wiersza to prawo do lewa. Opis ma małą literówkę, powinno być "Wynik to, że początek elementu pozostaje po prawej stronie (ponieważ dla rtl, początek jest po prawej stronie, ale w stosunku do domyślnego układu ltr, cała zawartość jest odwrócona)":

div {
  inset-inline-start: 50px;
  direction: rtl;
}

Spróbuj sam

Język CSS

inset-inline-start: auto|length|initial|inherit;

Wartość atrybutu

Szczegóły techniczne

Obsługa przeglądarek

Tabela zawiera wersje przeglądarek, które w pełni obsługuje tę właściwość.

Strony związane

Tutorial:CSS pozycjonowanie

Wskazówka:Atrybut position w CSS

Wskazówka:Atrybut direction w CSS

Wskazówka:Atrybut writing-mode w CSS