Media Query CSS

Permisi agan, saya mau bertanya jika ingin mempelajari media query pada css itu awal baiknya dimulai darimana ya?

avatar nauvalpahlevi
@nauvalpahlevi

8 Kontribusi 1 Poin

Diperbarui 6 tahun yang lalu

4 Jawaban:

Bisa dimulai dari nav gan, biasanya ketika diukuran tablet, navigasi detail hilangkan dan diganti dengan navigasi bars yang seperti garis tiga biji horizontal kebawah.

Ane kasi apa aja ukuran di web yg biasa dipakai programmer.


Laptop: max-width: 1366px
Tablet: max-width: 768px
Android : max-width: 425px
Iphone 5s: max-width:320px

Jikau ingin melihat lebih detail, buka chrome->tekan f12 atau klik kanan lalu buka inspect element-> disebelah kiri atas ada 2 tombol lalu pilih tombol yg bukan berbentuk cursor->pilih ukuran sesuai yg diinginkan dengan klik border browser yg ada diatas

avatar mhdadil
@mhdadil

105 Kontribusi 61 Poin

Dipost 6 tahun yang lalu

kalau saya mencoba dalam screen seperti ini gmna ya gan ngatur menu nya ? mungkin bisa kasih contoh codenya gan, biar ane lebih memahami @mhdadil

avatar nauvalpahlevi
@nauvalpahlevi

8 Kontribusi 1 Poin

Dipost 6 tahun yang lalu

Jawaban Terpilih

klo menrut sya pribadi, media query pd css itu ibaratkan pengkondisian seperti pd program (if else).

contoh logikanya, ketika tampil di desktop lebar elemen 1200px tapi ketika di handphone lebarnya jadi 600px.

contoh dalam kode:

element {
    width: 1200px;
}

@media (max-width: 600px) {
    element {
         width: 600px;
    }
}

avatar andriyfm
@andriyfm

23 Kontribusi 8 Poin

Dipost 6 tahun yang lalu

coba dipelajari pada link https://www.w3schools.com/css/css3_mediaqueries.asp tersebut gan. semoga membantu

avatar sptndc
@sptndc

247 Kontribusi 59 Poin

Dipost 6 tahun yang lalu

Login untuk ikut Jawaban