Tutorial Dasar CSS Pengenalan Position Pada CSS

Tutorial Dasar CSS Pengenalan Position Pada CSS
Hi Web Developer! kali ini guru design akan berbagi tutorial position pada css. Buat para master tolong di koreksi kalau-kalau ada salah, tapi saya rasa tidak ada heheh. Buat para newbie yok di simak dan dipahami. Ok lanjut:

Pertama kita harus tahu dulu position pada CSS itu apa sih?, jadi position pada CSS adalah suatu setting atau pengaturan yang mengatur posisi sebuah element HTML. Semisal kita ingin membuat beberapa element HTML dengan posisi yang berbeda maka position pada CSS ini wajib digunakan, dengan adanya property position ini kita bisa sesuka kita menempatkan posisi sebuah element HTML.

Adapun position yang dapat digunkan untuk mengatur posisi sebuah elemen HTML adalah:
  1. Position:static;
  2. Position:relative;
  3. Position:fixed;
  4. Position:absolute;
Apakah sudah bisa dipahami?, saya anggap sudah dapat dipahami ok lanjut.
Berikut tabel properti position

Properti Value Keterangan
Position:static static Posisi ini digunakan untuk mengatur sebuah element menjadi statis secara default dalam arti element HTML akan mengikuti posisi normal secara default.
Position:relative relative Posisi ini digunakan untuk mengatur sebuah element menjadi posisi normal.
Position:fixed fixed Posisi ini digunakan untuk mengatur sebuah element menjadi posisi tetap, walaupun di scroll   sekalipun. Posisi ini biasanya digunakan pada sebuah header atas website.
Position:absolute absolute Posisi ini digunakan untuk mengatur sebuah element tertimpa dengan elemen lainnya. Posisi ini biasanya digunakan pada menu dropdown sebuah website.

Jika ada yang kurang di pahami silahkan tulis di komentar

NEXT Tutorial Dasar CSS Membuat Efek Transisi Pada Element HTML (Ready)
Sekian semoga bermanfaat terimakasih.

About the Author

Seorang yang hobi nulis dan hobi berbagi kebaikan❣️

تعليقان (2)

  1. Thanks for sharing mas. Bermanfaaf!
    1. Sama sama mas ... Semoga bermanfaat.☺
Cookie Consent
Kami menggunakan cookies di situs ini untuk menganalisis lalu lintas, mengingat preferensi Anda, dan mengoptimalkan pengalaman Anda.
Oops!
Sepertinya ada yang salah dengan koneksi internet Anda. Harap sambungkan ke internet dan mulai menjelajah lagi.
AdBlock Detected!
Kami telah mendeteksi bahwa Anda menggunakan plugin pemblokir iklan di browser Anda.
Pendapatan yang kami peroleh dari iklan digunakan untuk mengelola situs web ini, kami meminta Anda untuk memasukkan situs web kami ke dalam daftar putih pada plugin pemblokir iklan Anda..
Site is Blocked
Sorry! This site is not available in your country.