Еще одна интересная проблема .... Я исправил CSS, чтобы сделать ВСЕ тексты адаптивными на моем сайте Bootstrap4.Это прекрасно работает, и я использовал ниже, чтобы сделать это ...
@media (max-width: 576px) {
html { font-size: 0.7rem; }
th { font-size: 1rem; }
}
@media (min-width: 768px) {
html { font-size: 0.8rem; }
th { font-size: 1rem; }
}
@media (min-width: 992px) {
html { font-size: 0.8rem; }
th { font-size: 1rem; }
}
@media (min-width: 1200px) {
html { font-size: 0.8rem; }
th { font-size: 1rem; }
}
Это в верхней части файла.
Затем я понял, что в то время как размер шрифтана мобильном телефоне приятно читать и работать, отображаемое меню немного маленькое для пальцев колбасы. Поэтому я смотрел на «увеличение» размера только панели навигации для мобильных устройств.Я обнаружил, что это работает на экране ПК (уменьшен), но по какой-то причине не будет воспроизводиться на мобильном устройстве.
В основном я добавил строки .navbar-nav .nav-link,
и font-size: 2rem;
в раздел мультимедиа.вниз по линии 4270ish
@media (max-width: 576px) {
.navbar-nav .nav-link,
.navbar-expand-sm > .container,
.navbar-expand-sm > .container-fluid {
padding-right: 0;
padding-left: 0;
font-size: 2rem;
}
}
Как уже говорилось, это работает на экране ПК ... Когда вы рисуете окно в шрифте, постепенно уменьшается до тех пор, пока оно не достигнет минимума, благодаря чему меню будет свернуто под ним 'hamburger ', но шрифт становится в два раза больше, только для пунктов меню.
Просто нужно увеличить шрифт navbar на маленьком сенсорном экране, чтобы сделать меню более удобными ... Пожалуйста, помогите.