Как изменить текст с помощью media queries?

Question

[DmitryGrachov]

Здравствуйте. Вообщем суть вопроса такова. Как изменить текст при помощи медиа запроса? Предположим есть медиа запрос - max-width: 800px, и текста в обычном теге . Так вот как при помощи это медиа запроса изменить или поменять количество текста в теге . Может я не в ту сторону мыслю и это делается не медиа запросами, а чем-то другим. Вообщем приму все варианты какие возможны в данном случае. Спасибо.

Answer 1

[Максим Сафаралиев]

Как вариант, спрятать тег, а в запросе показать другой, нужный тег с текстом, который нужно отображать при запросе. Т.е. имеем два тега - один который показывается без запроса, второй показывается с запросом.

Answer 2

[kulaeff]

Изменить текст с помощью медиа запросов вы не сможете, но сможете скрыть один вариант текста, и показать другой. Простой пример: https://jsfiddle.net/38wnxd4L/

Answer 3

[Никита Кит]

Если не хочешь создавать разные элементы с разными вариациями и при этом текст не подтягивается из базы данных, то помести его в before и after. Манипулируй ими через САБАКАmedia и всё будет ок. Хотя даже с подтягиванием данных с базы, можешь создать элементу кастомные атрибуты data-before и data-after, поместив в их значение плейсхолдеры, яваскриптом в :before и after style content передавать необходимые данные

Answer 4

[Negwereth]

Вам нужен window.matchMedia

Answer 5

[Алексей Николаев]

Если вам нужно обрезать текст (сделать его короче), посмотрите в сторону text-overflow и размеров блока. Если вам нужно показать другой, четко заданный текст, то только создавать второй элемент, и при определенных разрешениях скрывать \ показывать нужное.