Sobes.tech
Junior — Middle

შეგიძლიათ ახსნათ media query-ის მუშაობის პრინციპი ვებ-განვითარებაში?

sobes.tech AI

პასუხი AI-სგან

Media query — ეს CSS მექანიზმია, რომელიც საშუალებას აძლევს სხვადასხვა სტილები გამოიყენოს მოწყობილობის ან ბრაუზერის ფანჯრის მახასიათებლების მიხედვით, მაგალითად, ეკრანის სიგანე, მიმართულება, განზომილება და სხვა პარამეტრები.

ვებ განვითარებაში, media query გამოიყენება რეაგირებადი დიზაინის შესაქმნელად, რათა საიტი სწორად გამოჩნდეს სხვადასხვა მოწყობილობაზე — მობილურ ტელეფონებიდან დიდ მონიტორებამდე.

მაგალითი media query-ის, რომელიც იცვლის ფონურ ფერს, როდესაც ეკრანის სიგანე ნაკლებია 600px-ზე:

@media (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}

Flutter-ში, მიუხედავად იმისა, რომ media query ვებსიდან არის, არსებობს მსგავსი კლასი MediaQuery, რომელიც საშუალებას აძლევს მიიღოს ინფორმაცია ეკრანის ზომის და სხვა პარამეტრების შესახებ, რათა შექმნას ადაპტირებული ინტერფეისი.