Media query

Media query je tehnologija koja se koristi u dizajniranju web stranica, koja omogućava prilagodbu izgleda i rasporeda stranice ovisno o parametrima uređaja korisnika, kao što su rezolucija ekrana, orijentacija ili vrsta uređaja. Zahvaljujući media queryju, kreatori stranica mogu stvarati responzivne stranice koje izgledaju dobro i na stolnim računalima i na mobilnim uređajima.

Kako djeluju media queryji?

Media queryji provjeravaju svojstva uređaja i na temelju toga primjenjuju odgovarajuća pravila CSS. Na primjer, možete definirati različite stilove za ekrane širine manje od 768 piksela, što omogućuje da se stranica pravilno prikazuje na mobilnim uređajima. Ova funkcionalnost je posebno važna pri stvaranju internetskih trgovina, koje moraju biti intuitivne i pregledne na različitim platformama. Evo primjera koda CSS s upotrebom media queryja:

        
        @media (max-width: 768px) {
            body {
                background-color: svijetloplava;
            }
        }
        
    

U gornjem primjeru, ako je širina ekrana manja od 768 piksela, pozadina stranice će se promijeniti u svijetloplavu. Media query omogućava stvaranje fleksibilnijih i pristupačnijih web stranica – to je ključni alat u arsenalu svakog web developera. Responzivne stranice su bolje ocijenjene od strane tražilica, što može poboljšati pozicioniranje stranice i privući više posjetitelja. Dobro dizajnirana web stranica koja fluidno funkcionira na različitim uređajima može povećati povjerenje kupaca i poboljšati rezultate prodaje.

]]>