CSS3 Media Query

jenis media CSS2

@media aturan dijelaskan dalam CSS2, dan dapat disesuaikan untuk jenis media yang berbeda aturan gaya yang berbeda.

Sebagai contoh: Anda dapat menetapkan aturan gaya yang berbeda untuk berbagai jenis media yang (termasuk display, perangkat portabel, televisi, dll).

Tapi jenis multimedia mendukung pada banyak perangkat masih cukup ramah.

CSS3 Media Query

permintaan CSS3 multimedia mewarisi semua jenis media CSS2 pikiran: Alih-alih menemukan jenis peralatan, CSS3 pengaturan tampilan sesuai dengan adaptasi.

pertanyaan media dapat digunakan untuk mendeteksi berbagai hal, seperti:

• viewport (jendela) lebar dan tinggi
• Lebar dan tinggi dari aparatur
• Menuju (Smartphone layar horizontal, layar vertikal).
• resolusi

Saat ini, banyak untuk ponsel Apple, ponsel Android, tablet dan perangkat lainnya akan digunakan untuk menampilkan query.

Dukungan Browser

Angka dalam tabel tersebut merupakan browser pertama yang mendukung nomor versi properti.

sintaks query Multimedia

Permintaan Multimedia disusun oleh berbagai media, dapat berisi satu atau lebih ekspresi, ekspresi didirikan sesuai dengan kondisi mengembalikan benar atau salah.

@media not|only mediatype and (expressions) {
    CSS-Code;
}

Jika media ditentukan jenis pencocokan jenis perangkat, permintaan kembali benar, dokumen akan menunjukkan efek dari gaya ditentukan dalam pencocokan perangkat.

Kecuali Anda menggunakan tidak hanya operator atau sebaliknya, semua gaya akan menyesuaikan tampilan pada semua perangkat.

• tidak: tidak boleh digunakan untuk mengecualikan perangkat tertentu, seperti @media tidak mencetak (peralatan non-printing).

• hanya: untuk mengatur beberapa jenis media khusus.Dukungan untuk Media Query perangkat mobile, jika hanya ada kata kunci, browser Web untuk perangkat mobile akan mengabaikan satu-satunya kunci dan ekspresi setelah aplikasi langsung dari gaya berkas. Untuk Media Query bila perangkat tidak mendukung kemampuan untuk membaca, tetapi Media Jenis jenis browser Web, kata kunci yang dihadapi hanya mengabaikan berkas gaya ini.

• semua: semua perangkat, ini harus selalu melihat.

Anda juga dapat menggunakan file gaya yang berbeda pada media yang berbeda:

jenis media CSS3

contoh sederhana penyelidikan multimedia

Menggunakan query multimedia dapat digunakan untuk menggantikan gaya asli yang sesuai dengan gaya pada perangkat tertentu.

Contoh berikut mengubah warna latar belakang pada layar terlihat ukuran jendela peralatan lebih besar dari 480 piksel:

Contoh berikut ini terlihat di ukuran layar window lebih besar dari 480 pixel akan mengapung ke halaman menu kiri:

referensi @media CSS3

Temukan konten multimedia lainnya dapat merujuk @media aturan.