position：stickyとposition：fixedの違いは？
私はCSSが初めてなので、ドキュメントを理解するのはかなり困難でした。誰かがposition:stickyとposition:fixedの実際の違いを説明できますか？私も例に感謝します。
https://developer.mozilla.org/en-US/docs/Web/CSS/position および他のいくつかの記事を読み終えましたが、まだわかりません。
position: fixedは常に、スクロールコンテナまたはビューポート内の特定の位置に要素を固定します。コンテナをどのようにスクロールしても、コンテナはまったく同じ位置にとどまり、コンテナ内の他の要素のフローには影響しません。
特定の詳細に進むことなく、position: stickyは基本的に要素が特定のオフセットを超えてスクロールされるまでposition: relativeのように動作し、その場合、要素はposition: fixedに変わり、要素がビューの外にスクロールされるのではなく、位置。最終的に、元の位置に向かってスクロールして戻り、スタックが解除されます。少なくとも、それは理論的にそれを理解する方法です。
詳細を避けたいのは、position: stickyが真新しく、実験的（リンク先のドキュメントに記載）であり、まだ確定していないためです。上記で述べたことでさえ、近い将来に変わる可能性があります。とにかくposition: stickyを使用することはできません（これは来年中に変更されることを願っています）。
Mozillaは最近position: stickyhere の実装を発表しました。それは非常に価値があります。
わかりやすくするために、この自明の例を参照してください。 [〜＃〜] codepen [〜＃〜]
固定位置：
固定位置の要素は、ビューポートまたはブラウザウィンドウ自体に対して表示されます。ページがスクロールされても、常に同じ場所にとどまります。
ページ内の他の要素のフローには影響しません。つまり、特定のスペースを占有しません（
position: absolute）。他のコンテナ（相対/絶対位置の有無にかかわらず）内で定義されている場合でも、そのコンテナではなくブラウザに対して配置されます。 （ここでは
position: absolute）。
スティッキーポジション：
スティッキー位置を持つ要素は、ユーザーのスクロール位置に基づいて配置されます。 @ Boltclock で述べたように、要素が特定のオフセットを超えてスクロールされるまで、それは基本的にposition：relativeのように動作します。スクロールバックすると、以前の（相対）位置に戻ります。
ページ内の他の要素のフローに影響を与えます。つまり、ページ上の特定のスペースを占有します（
position: relative）。コンテナ内で定義されている場合、そのコンテナに対して配置されます。コンテナにオーバーフロー（スクロール）がある場合、スクロールオフセットに応じて、position：fixedに変わります。
そのため、コンテナ内で固定機能を実現する場合は、スティッキーを使用します。