CSS3

：

CSS関数

：

min()

　編集：2022.12.03 by T.A.

[Edge]○。→●、mdn

最小値の指定。

min( <calc-sum># )

<calc-sum>: ＝<calc-product> [ [ "+" | "-" ] <calc-product> ]*

<calc-product>: ＝<calc-value> [ "*" <calc-value> | "/" <number> ]*

<calc-value>: ＝<number> | <dimension> | <percentage> | ( <calc-sum> )

¶値を羅列して、その中で条件に見合った値が採用される。

<DIV style="border:1px solid black; width:200px; height:200px;
">
 <SPAN id=IdSpan style="border:1px solid red;
  font-size:min(5vw,100px);
 ">あ</SPAN>
</DIV>
<INPUT value="min(3vw,100px)" onkeydown="if(event.keyCode==13)IdSpan.style.fontSize=this.value">

ウインドウのサイズを変えてみて

テスト

ここに表示

スクリプト：

スクリプト：

表示内容：