Позиция

Элемент позициясен тиз конфигурацияләү өчен бу стенограмма ярдәмендә кулланыгыз.

Уртак кыйммәтләр

Тиз позицияләү класслары бар, алар җаваплы булмаса да.

<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>

Төп

Элементны күренешнең башында, читтән читкә урнаштырыгыз. Сезнең проектта тотрыклы позициянең нәтиҗәләрен аңлавыгызга инаныгыз; сезгә өстәмә CSS өстәргә кирәк булырга мөмкин.

<div class="fixed-top">...</div>

Төп

Элементны күренешнең аскы өлешенә урнаштырыгыз. Сезнең проектта тотрыклы позициянең нәтиҗәләрен аңлавыгызга инаныгыз; сезгә өстәмә CSS өстәргә кирәк булырга мөмкин.

<div class="fixed-bottom">...</div>

Ябык

Элементны күренешнең өске өлешенә урнаштырыгыз, читтән читкә, ләкин сез аны үткәннән соң гына. .sticky-topКоммуналь хезмәт CSS'ларны куллана , position: stickyбу бөтен браузерларда тулысынча булышмый.

IE11 һәм IE10 шулай position: stickyитеп күрсәтәчәк position: relative. Шулай итеп, без стильләрне @supportsсорау белән төрәбез, ябышуны дөрес күрсәтә алган браузерлар белән генә чиклибез.

<div class="sticky-top">...</div>