PHP регулярное выражение соответствует всем, кроме, если содержит запятую

Это может быть не очень практично, но если вы хотите, чтобы шрифт был прямой функцией родителя, без какого-либо JS, который прослушивает / цикл (интервал) для чтения размера div / страницы, существует способ сделай это. Iframes. Все, что находится внутри iframe, будет рассматривать размер iframe как размер окна просмотра. Таким образом, трюк состоит в том, чтобы просто создать iframe, ширина которого является максимальной шириной, которую вы хотите, чтобы ваш текст был, и высота которого равна максимальной высоте * пропорции конкретного текста.

Отменив ограничение, которое единицы просмотра не могут также поступать вдоль боковых родительских блоков для текста (как и в случае, когда размер% ведет себя как все остальные), блоки видового экрана предоставляют очень мощный инструмент: возможность чтобы получить размер min / max. Вы не можете сделать это где-нибудь еще - вы не можете сказать ... сделайте высоту этого div, чтобы ширина родительского * что-то.

Как говорится, трюк заключается в использовании vmin и установке размера iframe, так что общая высота [fraction] * является хорошим размером шрифта, когда высота является предельным размером, а [fraction] * общая ширина, когда ширина является предельной величиной. Вот почему heigh должен быть продуктом ширины и пропорции.

для моего конкретного примера у вас есть

.main iframe{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: calc(3.5 * 100%);
  background: rgba(0,0,0,0);
  border-style: none;
  transform: translate3d(-50%,-50%,0);
}

. Небольшое раздражение этим методом заключается в том, что вам нужно вручную установить CSS iframe. Если вы прикрепляете весь файл CSS, это потребует большой пропускной способности для многих текстовых областей. Итак, что я делаю, это правило, которое я хочу получить непосредственно из моего CSS.

var rule = document.styleSheets[1].rules[4];
var iDoc = document.querySelector('iframe').contentDocument;
iDoc.styleSheets[0].insertRule(rule.cssText); 

Вы можете написать небольшую функцию, которая получает правило CSS / все правила CSS, которые влияют на текстовую область.

Я не могу придумать другой способ сделать это, не имея какого-нибудь велосипедного / прослушивающего JS. Реальное решение будет заключаться в том, чтобы браузеры предоставляли способ масштабирования текста как функции родительского контейнера AND, а также предоставляли те же функции типа vmin / vmax.

JS fiddle: https: // jsfiddle.net/0jr7rrgm/3/ (нажмите один раз, чтобы заблокировать красный квадрат мыши, щелкните еще раз, чтобы отпустить)

Большая часть JS в скрипке - это просто мое пользовательское перетаскивание мышью функция