Bagaimana untuk melumpuhkan tatal halaman dalam css

Apabila melakukan pembangunan web, kami sering menghadapi keperluan untuk membetulkan elemen halaman tertentu dan melarangnya daripada meluncur dengan roda skrol atau menyentuh skrin. Pada masa ini, CSS menyediakan beberapa kaedah untuk menghalang halaman daripada menatal Artikel ini akan memperkenalkan langkah pelaksanaan dan senario penggunaan kaedah ini secara terperinci.

1. Lumpuhkan penatalan keseluruhan halaman

1. Gunakan atribut limpahan

Limpahan ialah atribut dalam CSS yang digunakan untuk mengawal kandungan limpahan elemen . Nilainya termasuk kelihatan, tersembunyi, tatal, auto, dll. Untuk melumpuhkan penatalan keseluruhan halaman, kami hanya perlu menambah gaya berikut pada elemen akar html atau kandungan keseluruhan halaman:

html,body{
limpahan: tersembunyi;
}

Prinsip kaedah ini sangat mudah, iaitu menyembunyikan bahagian limpahan elemen halaman, seterusnya mencapai kesan larangan menatal halaman.

2. Gunakan kedudukan dan atribut teratas

Kaedah ini perlu menambah elemen bekas untuk membalut kandungan halaman, dan kemudian menetapkan kedudukan tetap dan atribut teratas kepada bekas elemen untuk mencapai larangan Tatal halaman. Gaya khusus adalah seperti berikut:

.bekas{
kedudukan: tetap;
atas: 0;
kiri: 0;
kanan: 0;
bawah: 0 ;
}

Di sini, kaedah penentududukan elemen kontena ditetapkan kepada tetap, yang bermaksud ia ditetapkan relatif kepada port pandangan Atribut atas bermaksud jarak antara elemen dan bahagian atas viewport ialah 0, yang bermaksud kandungan halaman ditetapkan pada viewport di bahagian atas halaman untuk mengelakkan penatalan halaman.

2. Lumpuhkan penatalan beberapa elemen

1. Gunakan atribut limpahan

Kaedah ini sama seperti melumpuhkan penatalan keseluruhan halaman anda sahaja perlu melumpuhkan penatalan. Hanya tetapkan atribut limpahan elemen kepada tersembunyi, contohnya:

.content{
limpahan: tersembunyi;
}

2. Gunakan kedudukan dan atribut teratas

adalah serupa dengan kaedah melumpuhkan penatalan keseluruhan halaman Kami perlu menambah elemen bekas untuk membalut elemen yang perlu dilumpuhkan, dan menambah kedudukan tetap dan atribut teratas kepada elemen bekas, contohnya:

.pembungkus {
kedudukan: tetap;
atas: 0;
kiri: 0;
kanan: 0;
}
.kandungan{
ketinggian: 1000px;
limpahan : auto;
}

Di sini, elemen yang perlu dilarang daripada menatal diletakkan di dalam elemen bekas dan gaya daripada bar skrol yang muncul secara automatik selepas melebihi saiz ditambah pada limpahan elemen: auto, manakala elemen bekas ialah Gunakan kaedah di atas untuk mencapai kesan melumpuhkan penatalan.

Di atas ialah cara untuk melumpuhkan penatalan halaman menggunakan CSS. Walau bagaimanapun, perlu diingatkan bahawa kaedah ini hanya melumpuhkan penatalan halaman dalam prestasi Malah, pengguna masih boleh menatal halaman melalui operasi lain, seperti menggunakan penyemak imbas untuk bergerak ke hadapan dan ke belakang, menyeret bar skrol, dsb. Oleh itu, dalam aplikasi praktikal khusus, pengoptimuman dan penambahbaikan yang sesuai perlu dijalankan mengikut keperluan khusus.

Atas ialah kandungan terperinci Bagaimana untuk melumpuhkan tatal halaman dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!