Как установить равный размер шрифта в ячейках таблицы для мобильных устройств html-страниц

У меня возникла проблема с отображением шрифтов на мобильных устройствах. У меня есть простая ширина таблицы, установленная на 800 пикселей, общий размер для сегодняшних мобильных телефонов.

Текст в моих ячейках использует один и тот же html css-макияж. Текст в первой строке выглядит нормально

Но следующая строка – проблема, которая разбита на две ячейки. Левая ячейка – это изображение, а в правой ячейке есть текст. Моя проблема в том, что большинство мобильных веб-браузеров уменьшают размер шрифта в этой ячейке.

Для меня было бы неплохо, если бы этот текст был просто распространен на несколько строк, но этого не происходит, они, как правило, сохраняют столько же строк, сколько и в представлении рабочего стола.

Я установил размер шрифта, используя pt px, и никакого эффекта в файле css, как

.DefaultFont { font-family: 'Merriweather Sans', Arial,verdena,sans-serif; font-size: 13pt; font-style: normal; color:#4e0203; font-weight: 400; } 

Использовал 13pt 13em и другие методы и т. Д. Ничего не работало.

И для элемента html использовался span и div и p и пробовал его внутри td-элемента, но опять-таки никакого эффекта.

PS Я не ищу javascript трюки для масштабирования страниц на стороне клиента с обнаружением устройств и т. Д. Поскольку я просто использую php, чтобы определить, есть ли на нем рабочий стол или мобильное устройство (для чего требуется меньше кода для передачи). Мне просто нужен код, чтобы шрифт не изменился, вызванный мобильным веб-браузером.

Как отключить эти клиенты от масштабирования частей таблиц?


РЕШЕНИЕ Окончательное решение, которое сработало очень хорошо, было комбинацией нескольких людей здесь.

  • Установите ширину таблицы в%
  • Установите размер шрифта в vw (который, как%, также имеет индекс 100), низкое значение, равное 2 или около того.
  • Примечание. Vw поддерживается партиями больше, чем размер шрифта, а также изображения.
  • Включите метатег, который он даже работал без этого выше, но, чтобы быть в безопасности, я рекомендую его.

Solutions Collecting From Web of "Как установить равный размер шрифта в ячейках таблицы для мобильных устройств html-страниц"

Возможно, вы должны использовать типографические единицы размера для видовых экранов для размера font-size .

Его можно использовать, когда вы хотите размер вещи через ширину или высоту контейнера (например, контейнера). Или и то, и другое. Возможные значения:

Vh – высота видового экрана
Он пропорционален размеру контейнера.

 font-size: 2vh; 

Vw – ширина окна просмотра
Он пропорционален ширине контейнера.

 font-size: 2vw; 

Vmin – минимальный размер окна просмотра
Он пропорционален размеру между «vh» и «vw».

  font-size: 2vmin; 

Vmax – максимальный объем просмотра
Он пропорционален размеру между «vh» и «vw».

  font-size: 2vmax; 

Это, безусловно, может дать вам взгляды, которые вы хотите. Просто найдите текущее пропорциональное значение, и независимо от размера экрана он будет соответствовать!

Документы относительной длины просмотра W3

Вы пробовали метатеги, чтобы проверить, работает ли это …

  <meta name="viewport" content="width=device-width, initial-scale=1"> 

Это означает, что браузер (возможно) отобразит ширину страницы по ширине своего экрана. Поэтому, если этот экран имеет ширину 320 пикселей, окно браузера будет иметь ширину 320 пикселей, а не уменьшаться и отображать 960 пикселей (или, что бы то ни было, что делает это устройство по умолчанию, вместо ответного метатега).

Отъезд, это может быть полезно ..

Я думаю, что это должно сделать трюк

 -webkit-text-size-adjust: none; 

Вы можете использовать window.innerHeight .