Задать вопрос
npanuhin
@npanuhin
javascript

Как загрузить мобильную/Desktop-ную версии css (выбрать одну)?

Подскажите, пожалуйста, как исправить такую ситуацию:

В начале загрузки страницы (html) нужно выбрать: мобильное устройство, или нет (по ширене экрана будет достаточно). Затем загрузить соответствующий css фаил. Вот как делал я:

<head>
	<link rel='stylesheet' type='text/css' href='m.Main.css' media="all and (max-width:750px)"/>
	<link rel='stylesheet' type='text/css' href='Main.css' media="all and (min-width:751px)"/>
</head>


Но далее посмотрел в "историю загрузки" Firefox:

5b21488a8c368563718316.jpeg

И там видно, что загружаются оба файла => тратится трафик пользователя. (плохо)

Подскажите, пожалуйста, как этого избежать и загрузить только нужный фаил?
  • Вопрос задан
  • 285 просмотров
3 комментария
Подписаться 2 Средний 3 комментария
Решения вопроса 1
KPEATuBHO
@KPEATuBHO
Full-stack world-wide developer
Медиа-запросами не сделать, так как браузер грузит все стили, но уже применяет по месту. Вообще хороший тон средствами бэкенда определять с какого устройства пришел запрос и подставить соответствующий стиль, но в таком случае есть риск загрузить не тот файл стилей. Чтобы оперировать именно шириной, это только на js написать прямо в хед скрипт который подругзит тот или иной файл.
Ответ написан
3 комментария
3 комментария
Пригласить эксперта
Ответы на вопрос 1
IceRD
@IceRD
Указывается media= "only screen and ..." а для мобильной версии media= "handheld"
В вашем случае говорите
all and (max-width:750px)
загрузить для всех и для тех у кого экран с размером.

Вообще, не усложняйте себе работу, добавьте 2КВ media в общий сss
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Fullstack разработчик JavaScript, php
Дорстрой-36 • Воронеж
от 100 000 до 200 000 ₽
JavaScript FullStack developer
Wanted. • Санкт-Петербург
До 220 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Разработать телеграм mini app игру и бота
23 нояб. 2024, в 20:48
40000 руб./за проект
Ведение блогоаи продвижение в Instagram, TikTok и Телеграмм
23 нояб. 2024, в 20:46
50000 руб./за проект
Доработки шаблона Wordpress
23 нояб. 2024, в 20:39
3000 руб./за проект
Ещё заказы