Запрос относительно адаптивной веб-страницы с сеткой Bootstrap и медиазапросами CSS

Question

Я создал сайт с Bootstrap и использовал его систему сетки и медиазапросы CSS в соответствии с col-xs, col-md, он отзывчивый, но мне пришлось установить размер шрифта в соответствии с минимальной шириной в медиазапросе, которыйуменьшает его, когда достигает максимальной ширины того же медиазапроса.Как я могу настроить размер шрифта так, чтобы он соответствовал размерам экрана в этом медиазапросе?Нужно ли мне писать отдельные медиа-запросы для всех случаев?То же самое касается Bootstrap Carousel.

Я хочу добиться одинакового вида на всех размерах, возможно ли это?

Answer 1

Вы можете использовать медиа-запросы для установки размеров шрифта для разных портов просмотра.Выберите основной размер шрифта, и все изменится.

Sass mixins -

@include media-breakpoint-down(xs) {
  body{font-size: 10px;}
}

@include media-breakpoint-down(sm) {
  body{font-size: 14px;}
}

Меньше -

@media (max-width: @screen-xs) {
  body{font-size: 10px;}
}

@media (max-width: @screen-sm) {
  body{font-size: 14px;}
}

---

Вы также можете использовать CSS VW-единицы, которыеизменяет размеры относительно текущего размера области просмотра.

Из Трюки CSS -