CSS3 Sticky が有効にならない場合の対処方法

css3 スティッキー ソリューションが有効にならない: 1. 親要素に overflow:hidden または overflow:auto 属性を含めることはできません; 2. top、bottom、left、right の 4 つの値のいずれか必ず指定してください; 3. 親要素の高さ スティッキー要素の高さより低くすることはできません。

このチュートリアルの動作環境: Windows7 システム、css3 バージョン、thinkpad t480 コンピューター。

推奨事項: 「css ビデオ チュートリアル 」

sticky は次の理由により有効になりません:

• parent 要素が overflow:hidden または overflow:auto で設定されている

• #top、right、bottom、left の 4 つの値がいずれも指定されていません

• 親要素の高さは、スティッキー配置された要素の高さよりも小さいです。

• スティッキー属性は、ユーザーのスクロール、切り替えに依存します。位置:相対位置と位置:固定位置の間。

• 要素の配置は、特定のしきい値を超える前は相対配置であり、それ以降は固定配置です。

sticky 属性は、次の条件が満たされる場合にのみ有効です:

• 親要素はオーバーフローできません。 hidden または overflow:auto 属性

• top、bottom、left、right の 4 つの値のいずれかを指定する必要があります。それ以外の場合は相対値のみになります。位置

• 親要素の高さをスティッキー要素の高さより低くすることはできません

以上がCSS3 Sticky が有効にならない場合の対処方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。