Форум Сайтостроение Веб-строительство

Различное количество брейкпойнтов для сетки и тега

N
На сайте с 21.01.2018
Offline
58
Nonverbis
87
У сеток есть брейкпойнты. Например, сетка бутстрапа:

  1. XS = "(max-width: 575.98px)"
  2. SM = "(min-width: 576px) and (max-width: 767.98px)"
  3. MD = "(min-width: 768px) and (max-width: 991.98px)"
  4. LG = "(min-width: 992px) and (max-width: 1199.98px)"
  5. XL = "(min-width: 1200px) and (max-width: 1399.98px)"
  6. XXL = "(min-width: 1400px)"


И у тега <picture> могут быть медиа-запросы.

Допустим, я полагаю, что для изображения у этих медиа-запросов это слишком грубый шаг. Потому что по данным метрики за год экраны вот такие:
360
25,3 %
3 076
13,4 %
2,09
1:39
375
13,8 %
1 549
17,6 %
1,94
1:59
414
11,7 %
1 410
19,6 %
1,81
1:26
412
9,27 %
1 023
14,5 %
2,12
1:49
393
6,5 %
772
17 %
1,93
1:43
1920
6,4 %
649
13,1 %
2,98
2:59

Я хочу добавить брейкпойнт 375 только для тега <picture>:


  1. XXS = "(max-width: 374.98px)"
  2. XS = "(min-width: 375px) and (max-width: 575.98px)"
  3. SM = "(min-width: 576px) and (max-width: 767.98px)"
  4. MD = "(min-width: 768px) and (max-width: 991.98px)"
  5. LG = "(min-width: 992px) and (max-width: 1199.98px)"
  6. XL = "(min-width: 1200px) and (max-width: 1399.98px)"
  7. XXL = "(min-width: 1400px)"


Почему так? Потому что я согласен на резиновость верстки для данного типоразмера экрана. А вот размер изображения напрямую коррелирует с его весом. А с лишним весом я борюсь.

Вопрос: можно ли добавить лишний брейкпойнт только для тега picture? Или это будет дурно и мерзко?

Предупреждаю ответы про lazy: они не относятся к делу, потому что лениво или не лениво, а загружать картинку все равно придется. Так что лишний вес все равно - как ни крути - лишний.


Попробуйте новую Яндекс.Метрику
  • metrika.yandex.ru
Яндекс.Метрика поможет получить наглядные отчёты и видеозаписи действий отдельных посетителей, узнать, что ищут люди на вашем сайте, собирать статистику по каждому объявлению в Директе и следить за конверсией даже в офлайне.
W1
На сайте с 22.01.2021
Offline
306
webinfo
#1
Nonverbis :
Вопрос: можно ли добавить лишний брейкпойнт только для тега picture?

Естественно. Вы можете добавлять любой стиль для любого элемента. Бутстрап - это просто готовый "конструктор", а не догма. Если у вас есть потребность в других стилях, то ваше право их добавить.

А у  picture вообще про бутстрап речи вроде как нет, там srcset.

Мой форум - https://webinfo.guru –Там я всегда на связи
Как поисковики отнесутся к Bootstrap - колонка по Порядок следования DIV и

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий