Изменение размера шрифта при использовании мобильного устройства

Подскажите, пожалуйста, можно ли уменьшить размер шрифта при просмотре, например страниц, на мобильном устройстве.

То есть при использовании на ПК шрифта размером 18px, на смартфоне он был бы 12px.  

Google

 VladimirKo, свойство @media в css

 VladimirKo, свойство @media в css

Спасибо за подсказку, но меня больше интересовало можно ли это сделать в настройках движка.
Если можно, то как?

Может это, в настройках темы admin/settings/theme/modern. Лично я, понятия не имею что оно делает.

Подскажите, пожалуйста, можно ли уменьшить размер шрифта при просмотре, например страниц, на мобильном устройстве.

Немного с другой стороны...

Вообще юзер может сам настраивать, на мобильном, размер удобный для него. У вас на телефоне (если андроид) в Настройках-Дисплей-Размер и стиль шрифта, что стоит?

А ещё, рамер шрифта можно настроить в браузере.

То есть если вы в настройке телефона увеличили себе шрифт, а в браузере (у меня в Лисе «специальных возможностях») он настроен в «Автоматический размер» тогда он будет адаптироваться под системные настройки телефона.

Там же есть возможность принудительно задать размер для страниц в интернете.

У меня для мобильного на сайте, выставлены под «по умолчаню» на телефоне.

То есть при использовании на ПК шрифта размером 18px, на смартфоне он был бы 12px.

Для мобильного надо размеры не в px выставлять, а например в rem или в абсолютных ( small, medium, large)

Как то так:

 htmlbook.ru/css/font-size

learn.javascript.ru/css-units

Если я не в тему, сильно не пинайте)), но это, что у юзеров зачастую свои настройки просмотра на телефоне, надо учитывать когда вопрос ставится о размере шрифта на сайте. Всё достаточно сложно)

понятия не имею что оно делает

это поможет частично. Это подключит в итоговый файл стилей вот такой scss github.com/instantsoft/icms2/blob/master/templates/modern/scss/bootstrap/vendor/_rfs.scss

и к стилям типа

h4, .h4 {
    font-size: 1.5rem;
}

будут добавлены еще стили через media

@media (max-width: 1200px) {
    h4, .h4 {
        font-size: calc(1.275rem + 0.3vw);
    }
}

что сделает размеры текста зависимыми от ширины экрана.

Наверно автору поможет уменьшить «Базовый размер шрифта» до 0.9rem + включить опцию «Включить адаптивные размеры шрифтов».

Это уменьшит шрифт в целом и сделает его повышение в зависимости от ширины экрана более плавным.

Zau4man, 

Значит этот адаптивный, ваш пример выше — делает текст меньше при 1200. Как то и запутаться можно. Это значит что изначально размер должен быть завышен? 

Всегда думал что основа лежит от версии десктопной, а потом уж адаптировать под мобильную версию. АКА:

p {font-size:1em}

@media (max-width: 800px) {
        p {
          font-size:1.1em;
        }
      }    

 А тут надо заточить под мобильную ну а при достижении 1200(десктоп) уже уменьшится размер. Странно как то.

Короче, я лучше не буду об этом думать а то сейчас начну все стили перебирать. 

Всем спасибо за обсуждение!
В каком направлении двигаться примерно понятно.

Идея для разработчиков — создать компонент, который помог бы решить эту задачу.

 VladimirKo, Это же елеминтарный css(да пишу с ошибками). Вы можете задать любой размер текста в theme.css

Вы можете задать любой размер текста в theme.css

правильнее будет редактировать исходные SCSS-файлы, так как theme.css — это скомпилированный файл. При следующей компиляции все ваши правки в theme.css будут перезаписаны. Поэтому лучше вносить изменения в SCSS-заготовки, а затем перекомпилировать стили.

Вы можете задать любой размер текста в theme.css pupsik правильнее будет редактировать исходные SCSS-файлы, так как theme.css — это скомпилированный файл.

Это так и есть. После компиляции приходится заново редактировать файл theme.css.
А какой исходный SCSS-файл нужно редактировать, чтобы решить проблему?

И не лучше ли подключить свой CSS файл с помощью виджета https://instantcms.ru/addons/addjscss.html

А какой исходный SCSS-файл нужно редактировать, чтобы решить проблему?

Посмотрите записи из блога пользователя Zau4man про дочерние шаблоны, очень полезно:

Как не потерять правки в шаблоне. Делаем дочерний шаблон

и продолжение

Про дочерние шаблоны в 2.17.0

А какой исходный SCSS-файл нужно редактировать, чтобы решить проблему?VladimirKo Посмотрите записи из блога пользователя Zau4man про дочерние шаблоны, очень полезно: Как не потерять правки в шаблоне.

Да, действительно полезная информация.
Как Вы считаете, может быть для мобильника имеет смысл создать свой шаблон?

А какой исходный SCSS-файл нужно редактировать, чтобы решить проблему?VladimirKo Посмотрите записи из блога пользователя Zau4man про дочерние шаблоны, очень полезно: Как не потерять правки в шаблоне.

Это дело вкуса, если плохой адаптив или мобильная версия отличается сильно от ПК то да стоит сделать, я обычно делаю на проектах отдельный шаблон о максимально облегченный не грузит лишних стилей и скриптов