Mengapa Kedudukan Melekit Pecah dengan `overflow: hidden`?

Mengapa Kedudukan Melekit Berkelakuan Tanpa Jangka dengan Limpahan Tersembunyi

Dalam coretan HTML yang disediakan, div melekit diletakkan di dalam bekas. Biasanya, ia akan kekal kelihatan di bahagian atas kawasan tatal dalam bekasnya. Tingkah laku ini meniru pengepala dalam UITableView iOS.

Walau bagaimanapun, apabila bekas diberikan gaya limpahan:tersembunyi, kedudukan melekit gagal berfungsi dengan betul.

Memahami Kesan Limpahan :hidden

Peraturan limpahan:hidden mengehadkan kandungan dalam bekas unsur. Sebarang kandungan yang melebihi dimensi bekas disembunyikan daripada pandangan. Dalam kes unsur melekit, peraturan menghalangnya daripada menonjol di luar bekas apabila ia mencapai bahagian atas kawasan tatal.

Kedudukan Melekit dengan Limpahan:tersembunyi

Apabila elemen melekit menemui limpahan:tersembunyi, kedudukan melekitnya berkelakuan tidak menentu. Kelekatan terhad kepada kawasan yang kelihatan di dalam bekas. Semasa pengguna menatal, elemen melekit kekal dikekang oleh sempadan bekas dan bukannya mengikut panel penatalan.

Alternatif untuk Limpahan:tersembunyi

Untuk menyelesaikan isu ini, pertimbangkan menggunakan kaedah lain untuk menyembunyikan kandungan yang melimpah:

• Menggunakan contain:paint;: Sifat CSS ini mengehadkan kandungan limpahan pada sempadan bekas sambil membenarkan elemen melekit berkelakuan dengan betul.
• Memperkenalkan Laluan: Daripada menggunakan limpahan: tersembunyi, buat laluan keratan untuk menentukan kawasan yang boleh dilihat dalam bekas. Ini membolehkan elemen melekit melangkaui sempadan yang boleh dilihat oleh bekas dan mematuhi gelagat melekit yang diingini.

Atas ialah kandungan terperinci Mengapa Kedudukan Melekit Pecah dengan `overflow: hidden`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!