css-position之fixed vs sticky
fixed（固定定位）
元素相对于浏览器窗口是固定的，即使是窗口滚动，元素也是固定的
sticky（粘性定位）
基于用户滚定动来进行定位的，相当于relative定位 fixed定位的结合体
当未超过阈值的时候，他的行为就像relative，当超过特定阈值是他的行为就像fixed。
阈值是left，right，top，bottom（必须制定其一，才能使粘性定位生效，否则其行为与relative相同）
sticky事例：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>sticky</title> 6 <style> 7 div .sticky { 8 9 position: sticky; 10 top: 0; 11 padding: 5px; 12 background-color: #cae8ca; 13 border: 2px solid #4CAF50; 14 } 15 </style> 16 </head> 17 <body> 18 19 <p>尝试滚动页面。</p> 20 21 22 <div class="sticky">我是粘性定位!</div> 23 24 <div style="padding-bottom:2000px"> 25 <p>滚动我</p> 26 <p>来回滚动我</p> 27 <p>滚动我</p> 28 <p>来回滚动我</p> 29 <p>滚动我</p> 30 <p>来回滚动我</p> 31 </div> 32 33 </body> 34 </html>
