# 016: Menggunakan Kueri Media di Sass - Trik CSS

Anonim

Kami memperkenalkan konsep @mediakueri di CSS.

Banyak hal yang menggunakan Sass pada proyek ini memungkinkan kita lakukan adalah tetap KERING (jangan ulangi diri Anda sendiri). Kami melakukan pengaturan variabel warna dan ukuran. Kami melakukannya dengan tumpukan font kami. Sekarang kami melakukannya lagi dengan kueri media. Kapan pun kami membutuhkan kueri media, kami sekarang memiliki @mixin yang dapat kami gunakan. Dengan begitu jika kita perlu menyesuaikannya, kita dapat mengubahnya hanya di satu tempat.

Alih-alih menamai kueri media kami dengan hal-hal seperti "iPad" atau sesuatu yang terlalu spesifik seperti itu, kami hanya akan menggunakan beberapa nama yang sewenang-wenang tetapi dapat dimengerti seperti "Baby Bear" dan "Papa Bear".

Kami mulai dengan layar lebar, lalu mempersempitnya hingga navigasi terlihat buruk, dan itulah jeda kueri media pertama kami. Pada saat itu kami membagi navigasi menjadi dua baris empat, bukan satu baris delapan. Kami harus menyesuaikan bayangan agar terlihat benar.

Kami juga menyesuaikan lebar bungkus halaman pada kueri media tertentu, yang berarti kami perlu menyesuaikan cara kerja logo juga.