Bagaimanakah Saya Menggunakan Logik 'ATAU' dalam Pertanyaan Media CSS?

Menggunakan OR Logic dalam CSS Media Query

Apabila mentakrifkan pertanyaan media, adalah penting untuk mengetahui cara menentukan berbilang syarat menggunakan logik "OR" . Katakan anda ingin mentakrifkan peraturan gaya yang digunakan apabila sama ada lebar maksimum atau ketinggian maksimum port pandangan memenuhi kriteria tertentu.

Malangnya, menggunakan kata kunci "ATAU" adalah tidak sah dalam pertanyaan media CSS. Sebaliknya, sintaks yang betul adalah untuk memisahkan setiap keadaan dengan koma.

@media screen and (max-width: 995px), screen and (max-height: 700px) {
  ...
}

Dengan menggunakan koma, pertanyaan media akan digunakan pada mana-mana port pandangan dengan lebar maksimum kurang daripada atau sama dengan 995px atau max-height kurang daripada atau sama dengan 700px.

Gelagat ini disebabkan oleh perbezaan asas antara "DAN" (&&) dan "OR" (||) operator logik dalam pertanyaan media CSS. Pengendali "DAN" memerlukan kedua-dua syarat adalah benar, manakala pengendali koma (",") mewakili operasi "ATAU", di mana mana-mana syarat menjadi benar adalah mencukupi.

Memahami perbezaan ini apabila menulis pertanyaan media adalah penting untuk mencapai penggayaan yang diingini berdasarkan ciri port pandang peranti yang berbeza.

Atas ialah kandungan terperinci Bagaimanakah Saya Menggunakan Logik 'ATAU' dalam Pertanyaan Media CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!