Как сделать адаптивный текст для сайта?

Question

[Арсений]

Как сделать адаптивный текст для сайта?

Comments

[Undefiend]

Адаптивный в смысле? Чтобы размер менялся? Или расположение?

[Ankhena]

Кидаю
font-size: clamp(16px, 6vw, 56px)

или

.tt {font-size: 12px}
@media (min-width: 700px) {
  .tt {font-size: 18px}
}

Только в макет смотреть бы...

[FrelFrloich]

Ankhena, считаешь уже пора clamp юзать, у меня с понедельника новый макет приходит, вот и думаю поюзать или не стоит на рабочих пока.

[Ankhena]

FrelFrloich, если тз по браузерам позволяет.
Я уже несколько проектов сделала с clamp для разных клиентов.

[FrelFrloich]

Ankhena, основные требования что бы ios поддерживал, а как ни странно в них я никогда не шарил и в их версиях. 6-8 яблоки понимают кламп?

[Ankhena]

FrelFrloich, 6ка клиента и те, что я успела потестировать в browserstack понимают.

Узнаете интересные нюансы, буду рада почитать.

[FrelFrloich]

Ankhena, сделаю, к следующей пятнице, отпишусь что вышло при тестах на разных ios от 6 до 13, так скажем в живую.

[Ankhena]

FrelFrloich, ага, жду

[Ankhena]

FrelFrloich, про clamp у меня есть только одно сомнение: у меня всё не доходят руки потестировать, что будет, если у пользователя в браузере увеличенный шрифт.
Т.е. получат ли пользователи, которые его увеличили то, что хотели или нет.

[FrelFrloich]

Ankhena, Думаю может повести себя не адекватно, кстати, где то читал именно про этот косяк месяца два назад, точно не помню что там было, но явно затрагивалась именно эта тема, я про неё и забыл (.

Answer 1

[Andrew]

Привет! Есть медиа запросы - https://developer.mozilla.org/ru/docs/Web/CSS/Medi...
Для определенного разрешения указать размер текста.

Или пойти другим вариантом, использовать значение em - https://developer.mozilla.org/ru/docs/Web/CSS/font-size.
Смотрите по ситуации. Но обычно это медиа запросы.