Чуйний

1. Просто розробіть інтерфейс.
2. Адаптація екрана для сторінки знаходиться в певному діапазоні: наприклад, один набір для ПК (>1024), один набір для планшета (768-1024), один набір для мобільного телефону (<768); один набір для адаптивних сторінок All адаптовані. (Як ви можете собі уявити: адаптивний дизайн потрібно вважати набагато складнішим, ніж адаптивний)
3. Створіть веб-сторінку та використовуйте CSS Media Query, Content-Based Breakpoint та інші технології, щоб змінити розмір веб-сторінки для адаптації до екранів із різною роздільною здатністю.

Адаптивний

1. Потрібно розробити кілька інтерфейсів
2. Визначаючи роздільну здатність вікна перегляду, визначається, чи є пристрій, до якого в даний момент здійснюється доступ: ПК, планшет або мобільний телефон, таким чином запитуючи рівень обслуговування та повертаючи різні сторінки, адаптивний дизайн визначає роздільну здатність вікна перегляду та виконує операції на клієнті для різних клієнтів. Обробка коду для відображення різних макетів і вмісту.
3. Створюйте різні веб-сторінки для різних типів пристроїв і викликайте відповідні веб-сторінки після визначення роздільної здатності пристрою.

Розрізняйте чуйний і адаптивний

1. Використовуйте браузер chrome або edge, щоб відкрити URL-адресу на комп’ютері.
2. відповідно до F12 Або клацніть правою кнопкою миші та виберіть виявлення.
3. Натисніть у верхньому лівому куті панеліЗначок перемикання пристрою,Як показано нижче

4. Після перемикання,
   Макет, який відображається на комп’ютері та мобільних терміналах, автоматично перемикається, тобтоЧуйний, як-от цей сайт;
   Якщо макет не адаптується автоматично, макет перейде в режим адаптації після оновлення сторінки (URL стрибає або не стрибає), тобтоАдаптивний, наприклад Baidu;
   Якщо після оновлення немає перемикання, він не є ні чуйним, ні адаптивним, і він не адаптується до різних пристроїв.

пропозиція

• Перспектива розробки: одна сторінка, складні функції, прості функції, адаптивні.
• Точка зору SEO: пошукові системи зазвичай віддають перевагу оперативності.

Підведіть підсумки

• Чуйний:набір шаблонів; Адаптовані інтерфейсом, шаблони з різною роздільною здатністю об’єднуються в одну сторінку, а завантаження однієї сторінки шаблонів – це лише одна сторінка.
• Адаптивний:Кілька наборів шаблонів; Адаптований серверною частиною, кожен шаблон роздільної здатності має одну сторінку, а різні шаблони роздільної здатності завантажуються окремо.