Posisyon
Gamita kini nga mga shorthand utilities alang sa dali nga pag-configure sa posisyon sa usa ka elemento.
Komon nga mga mithi
Ang mga klase sa dali nga pagpoposisyon magamit, bisan kung dili sila mosanong.
<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>
Giayo nga tumoy
Ibutang ang usa ka elemento sa ibabaw sa viewport, gikan sa ngilit ngadto sa ngilit. Siguroha nga imong nasabtan ang mga sangputanan sa natudlong posisyon sa imong proyekto; tingali kinahanglan nimong idugang ang dugang nga CSS.
<div class="fixed-top">...</div>
Giayo nga ubos
Ibutang ang usa ka elemento sa ubos sa viewport, gikan sa ngilit ngadto sa ngilit. Siguroha nga imong nasabtan ang mga sangputanan sa natudlong posisyon sa imong proyekto; tingali kinahanglan nimong idugang ang dugang nga CSS.
<div class="fixed-bottom">...</div>
Malagkit nga ibabaw
Ibutang ang usa ka elemento sa ibabaw sa viewport, gikan sa ngilit ngadto sa ngilit, apan human lang nimo kini i-scroll sa ibabaw niini. Ang .sticky-top
utility naggamit sa CSS's position: sticky
, nga dili hingpit nga gisuportahan sa tanan nga mga browser.
Ang IE11 ug IE10 mag-render position: sticky
isip position: relative
. Ingon niana, among giputos ang mga istilo sa usa ka @supports
pangutana, gilimitahan ang pagkapilit sa mga browser lamang nga makahimo niini sa husto.
<div class="sticky-top">...</div>