Kedudukan melekit dan kedudukan tetap ialah dua kaedah penentududukan yang biasa digunakan dalam reka bentuk dan pembangunan web. Kedua-duanya membenarkan elemen dibetulkan di lokasi tertentu pada halaman, tetapi dengan cara yang berbeza. Artikel ini akan memperkenalkan secara terperinci perbezaan antara kedudukan melekit dan kedudukan tetap, dan memberikan contoh kod khusus untuk membantu pembaca memahami dengan lebih baik.
Berikut ialah kod sampel ringkas yang melaksanakan kesan bar navigasi yang ditetapkan di bahagian atas halaman apabila menatal ke bahagian atas halaman:
<!DOCTYPE html> <html> <head> <style> .navbar { position: sticky; top: 0; background-color: #f1f1f1; padding: 10px 0; text-align: center; } </style> </head> <body> <div class="navbar"> <a href="#">Home</a> <a href="#">About</a> <a href="#">Contact</a> </div> <div style="height:500px"> <p>Scroll down to see the effect</p> </div> </body> </html>
Dalam kod di atas, dengan menetapkan atribut kedudukan bagi bar navigasi kepada melekit, dan menetapkan bahagian atas Ia adalah 0, yang mencapai kesan bar navigasi ditetapkan di bahagian atas halaman semasa ia menatal.
Berikut ialah kod sampel ringkas yang melaksanakan kesan butang terapung yang mempunyai kedudukan tetap di sudut kanan bawah halaman:
<!DOCTYPE html> <html> <head> <style> .float-button { position: fixed; bottom: 20px; right: 20px; background-color: #f44336; color: white; padding: 16px; border-radius: 50%; font-size: 24px; text-align: center; cursor: pointer; } </style> </head> <body> <div class="float-button">+</div> </body> </html>
Dalam kod di atas, tetapkan atribut kedudukan butang apungan kepada tetap dan tetapkan bahagian bawah kepada 20px , kanan ialah 20px, mencapai kesan butang terapung yang ditetapkan di penjuru kanan sebelah bawah halaman.
Ringkasan:
Kedua-dua kedudukan melekit dan kedudukan tetap boleh mencapai kesan tetap elemen, tetapi kaedah dan kesan penggunaan adalah berbeza. Kedudukan melekit ialah kaedah penentududukan berbanding dengan aliran dokumen Apabila menatal ke kedudukan yang ditentukan, elemen tetap pada halaman adalah kaedah penentududukan relatif kepada tetingkap penyemak imbas tanpa mengira sama ada ia ditatal atau tidak. Mengikut keperluan khusus, anda boleh memilih kaedah penentududukan yang sesuai.
Atas ialah kandungan terperinci Bezakan antara kedudukan melekit dan kedudukan tetap. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!