Виконати інтерактивну вправу № 1
Виконати інтерактивну вправу № 2
Виконати інтерактивну вправу № 3
Опанувати веб конспект
Виконати практичне завдання № 1
Виконати практичне завдання № 2
Embedded Files
Відносні одиниці вимірювання
Ваш сайт повинен виглядати однаково на всіх пристроях. Повністю на всіх! від мобільного телефону до самого великого дозволу монітора.
З великими моніторами в основному проблем немає, там і так все зрозуміло, але от із планшетами та мобільними з'явилася проблема. Сайти не зовсім коректно відображаються на маленьких екранах, що завдає багато незручностей для користувача.
На вашому сайті повинен бути ЄДИНИЙ адаптивний дизайн, в якому використовується ОДИН код з коригуванням за розміром екрана.
На вашому сайті повинен бути ЄДИНИЙ адаптивний дизайн, в якому використовується ОДИН код з коригуванням за розміром екрана.
починаючи з 21 квітня 2015 року Гугл ввів нові методи ранжирування сайтів, в основі якого лежить адаптивний дизайн сайту. Якщо ваш сайт не має адаптивного дизайну, ваш ресурс буде знижуватися у видачі пошукової системи. Ось воно диво мобільних пристроїв.
веб_технології_12.pptxВарто подивитися та занотувати нові поняття та перевірити скріпти
Варто подивитися та занотувати нові поняття та перевірити скріпти
веб_урок_17-1-практична.docx
веб_урок_17-2-практична.pdfСписок популярних медіа-запитів для стандартного набору розширення екранів.
Список популярних медіа-запитів для стандартного набору розширення екранів.
@media only screen and (max-width : 1920px) {/* CSS правила */ }
@media only screen and (max-width : 1680px) {}
@media only screen and (max-width : 1366px) {}
@media only screen and (max-width : 1280px) {}
@media only screen and (max-width : 1024px) {}
@media only screen and (max-width : 800px) {}
@media only screen and (max-width : 768px) {}
@media only screen and (max-width : 600px) {}
@media only screen and (max-width : 533px) {}
@media only screen and (max-width : 360px) {}
@media only screen and (max-width : 320px) {}
@media only screen and (max-width : 240px) {}
@media only screen and (max-width : 176px) {}
Page updated
Google Sites
Report abuse