Kuiz 10 - Web

Për çka përdoren media queries në CSS?

• Për të definuar variabla në CSS.

• Për optimizimin e imazheve.

• Për të krijuar faqe uebi responsive.

• Për renderimin e kodit CSS

Çka nënkuptojmë me "breakpoints" në Responsive Web Design?

• Breakpoints paraqesin madhësinë maksimale të imazheve në një dizajn responsivë.

• Breakpoints është pika ku ndryshon ngjyra e faqes.

• Breakpoints paraqesin madhësinë minimale të fontit(tekstit).

• Breakpoints paraqesin gjerësine(width) e ekranit ku dizajni i faqes duhet të ndërroj në mënyrë që ti përshtatet pajisjeve tjera.

Çka paraqet viewport dhe pse është i rëndësishëm për media queries?

• Viewport është komplet faqja e uebit dhe nuk ka të bëj me media queries.

• Viewport është një lloj shtese(extension) i shfletuesit që të mundëson vendosjen e video/audio në ueb.

• Viewport është pjesa e dukshme e një faqe uebi dhe është e domosdoshme për vendosjen e media queries.

• Viewport paraqet ngjyrën e prapavijës dhe tekstit, dhe ndihmon në krijimin e pamjes më të mirë të faqeve uebi.

Cili është qëllimi kryesor i responsive web design.

• Responsive design vlenë vetëm për pajisjet mobile.

• Responsive design ka për qëllim krijimin e faqeve që duken bukur dhe qartë në pajisje të ndryshme.

• Fokusohet vetëm në përmirsimin e shpejtësisë së faqes.

• Responsive design eleminon nevojën për përdorimin e media queries.

Media queries mund të përdoren edhe për dizajnimin e faqes për printim?

• E saktë

• E pasaktë

Cila është sintaksa bazë e një media query në CSS.

• @keyframes (max-height: 600px) { ... }

• @media screen and (min-width: 600px) { ... }

• @media (width: 600px) { ... }

• @responsive (max-width: 600px) { ... }

Si vendosim kushtin për të aplikuar CSS në pajisjet me madhësi të ekranit (width) 600px e sipër?

• @media screen and (min-width: 600px)

• @media screen and (max-width: 800px)

• @media screen and (width: 600px)

• @media screen and (max-width: 600px)

Cili është dallimi në mes 'min-width' dhe 'max-width' në media queries?

• Nuk ka ndonjë dallim

• Të dyjat kan effektin e njejtë kur përdoren në media queries

• 'min-width' përdoret për pajisje mobile ndërsa 'max-width' është për PC.

• 'min-width' targeton pajisjet më të mëdha, përderisa 'max-width' targeton pajisjet më të vogla në media queries.

Cila është sintaksa për caktimin e një media query vetëm për printim?

• @ media screen {...}

• @ media print {...}

• @ media all {...}

• Nuk mund të vendosësh media query për printim

Cili është shembulli i saktë i një media query që ndryshon ngjyrën e sfondit (background) të faqes në ekrane më të mëdha se 768px.

• @media (max-width: 768px)

  { body { color: red; } }

• @media (max-width: 768px)

  { background-color: green; }

• @media (min-width: 768px)

  { body { background-color: blue; } }

• @media (min-width: 768px)

  { body { color: #222; } }