jenis jenis posisi css yang sering di gunakan

     

macam macam posisi css yang sering di gunakan untuk membuat website

• Static

Elemen posisi statis tidak terpengaruh oleh properti atas, bawah, kiri, dan kanan.

Elemen dengan posisi: statis; tidak diposisikan dengan cara khusus; itu selalu diposisikan sesuai dengan aliran normal halaman:

• Relative

Sebuah elemen dengan posisi: relatif; diposisikan relatif terhadap posisi normalnya.

Menyetel properti atas, kanan, bawah, dan kiri dari elemen yang posisinya relatif akan menyebabkannya disetel menjauh dari posisi normalnya. Konten lain tidak akan disesuaikan agar sesuai dengan celah yang ditinggalkan oleh elemen.

• Absolute 

Sebuah elemen dengan posisi: absolute; diposisikan relatif terhadap leluhur yang diposisikan terdekat (bukan diposisikan relatif terhadap viewport, seperti tetap).Namun; jika elemen yang diposisikan absolut tidak memiliki leluhur yang diposisikan, elemen tersebut menggunakan badan dokumen, dan bergerak bersama dengan pengguliran halaman.

Catatan: Elemen posisi absolut dihilangkan dari aliran normal, dan elemen dapat tumpang tindih.

• Sticky 

Elemen diposisikan berdasarkan posisi gulir pengguna.Beralih antara relatif dan tetap, tergantung

pada posisi.Itu diposisikan relatif sampai posisi offset yang diberikan terpenuhi di viewport - lalu "menempel" di tempatnya (seperti position:fixed).

• Fixed

Sebuah elemen dengan posisi: tetap; diposisikan relatif terhadap viewport, yang berarti selalu tetap di tempat yang sama bahkan jika halaman di-scroll. Properti atas, kanan, bawah, dan kiri digunakan untuk memposisikan elemen.Elemen tetap tidak meninggalkan celah di halaman tempat elemen tersebut biasanya berada.Perhatikan elemen tetap di sudut kanan bawah halaman. Berikut CSS yang digunakan :

Untuk Konten Berkualitas Tentang Pemrograman 🙏

Silakah kunjugi https://www.instagram.com/kurakuracoding/

untuk belajar dunia programan dan update teknologi bisa kunjungi website creativemediateknologi.com

................................................................... ...................

Silakan ketik di kolom komentar jika ada pertanyaan😃