Txoj hauj lwm
Siv cov khoom siv luv luv no txhawm rau txhim kho txoj haujlwm ntawm ib lub ntsiab.
Cov khoom muaj nqis
Cov chav kawm ceev ceev muaj, txawm tias lawv tsis teb.
<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>
Tsau saum
Muab cov khoom tso rau saum toj ntawm qhov chaw saib, los ntawm ntug mus rau ntug. Nco ntsoov tias koj nkag siab qhov cuam tshuam ntawm txoj haujlwm ruaj khov hauv koj qhov project; Tej zaum koj yuav xav tau ntxiv CSS ntxiv.
<div class="fixed-top">...</div>
Tsau hauv qab
Muab cov khoom tso rau hauv qab ntawm qhov chaw saib, los ntawm ntug mus rau ntug. Nco ntsoov tias koj nkag siab qhov cuam tshuam ntawm txoj haujlwm ruaj khov hauv koj qhov project; Tej zaum koj yuav xav tau ntxiv CSS ntxiv.
<div class="fixed-bottom">...</div>
nplaum sab saum toj
Muab cov khoom tso rau saum toj ntawm qhov chaw saib, los ntawm ntug mus rau ntug, tab sis tsuas yog tom qab koj scroll dhau nws. Kev .sticky-top
siv hluav taws xob siv CSS's position: sticky
, uas tsis txaus siab rau txhua qhov browsers.
IE11 thiab IE10 yuav ua position: sticky
raws li position: relative
. Yog li ntawd, peb qhwv cov qauv hauv cov @supports
lus nug, txwv qhov tsis sib xws rau cov browsers uas tuaj yeem ua tau zoo.
<div class="sticky-top">...</div>