@fastovvlad

Как сделать адаптивный шрифт css?

На сайте, есть меню ! На компьютере смотрится хорошо, но на более меньших размером гаджетов, шрифт ну слишком маленький, как лучше прописать в css , чтобы в зависимости от размера экрана, менялся размер шрифта в меню ?
5a8315d568c3e749305686.png5a8315dedd4c8178348870.png
  • Вопрос задан
  • 1176 просмотров
Решения вопроса 2
Использовать media queries css MDN
Ответ написан
Ankhena
@Ankhena
Нежно люблю верстку
Для адаптивных сайтов необходимо использовать meta-тег:
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Дальше задавать нужные размеры в соответствующих интервалах медиа условий.
Но нужно понимать, что, вероятно, придется переделать не только размер шрифта.
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
SilenceOfWinter
@SilenceOfWinter
та еще зажигалка...
задавать размер шрифта не в px, а в em\rem.
Ответ написан
drymind404
@drymind404
front-end разработчик
Задавать размеры текста, различных отступов, которые должны уменьшаться при уменьшении разрешения, с помощью единиц em и rem, в media-queries сделать несколько брекпоинтов, где уменьшать font-size у html в зависимости от разрешения. Нескольким элементам лучше задавать фиксированные размеры, в px. Например, параграфам. Иначе, как у вас, происходит чрезмерное уменьшение шрифтов. В своих сайтах обычно перед началом разработки уже выставляю p { font-size: 16px; } - тогда текст одинаково хорошо читается на любых устройствах. Некоторый не столь важный текст, показывающий, например, дополнительную информацию и тому подобное, можно делать меньше, например 12-14 px.
Ответ написан
Ваш ответ на вопрос

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

Войти через TM ID
Похожие вопросы