CSSサイズ単位のクリア

最近はcssに関することが多いので、css作業を頻繁に行い、サイズを指定する過程で多くの困難に直面しています.pxを含む複数の単位をすべて整理する.
px(ピクセル)
基本単位となる単位.分かりやすく、他の単位で計算しやすいです.しかし画素には大きな問題がある.
ピクセルを使用すると、Webのアクセス性が大幅に阻害されます.ほとんどのブラウザでは、ユーザーは通常のデフォルトフォントサイズ16 pxに設定できます.ユーザーは20 pxに変更され、フォントサイズは拡張されます.ただし、フォントサイズを30 pxに固定すると、常に30 pxに固定されます.
vw/vh(viewport width/viewport height)
vw,vhのvはviewport,すなわち可視領域である.ブラウザ幅が600 pxの場合、1 vwは6 px、他のユーザーのブラウザ幅が850 pxの場合、そのユーザーの1 vwは8.5 pxです.vw/vhはブラウザのサイズに応じて反応します.
彼らはcalc()とよく協力しています.はい、タイトル領域が50 pxの場合、コンテンツ領域をタイトル以外の部分として使用します.

height: cacl(100vh-50px);

一つ指定すればいいです.
vmin/vmax(viewpoint min/viewpoint max)
vminはvwとvhのより小さなアプリケーションを検索し、vmaxはより大きなアプリケーションを検索します.
ブラウザの幅が1200 px、高さが600 pxの場合、1 vwは12 px、1 vhは6 pxです.vwはより大きく,1 vmaxは1 vw,自然1 vminは1 vhであった.
vminとvmaxを使用すると、画面上の要素をいつでも作成したり、画面の要素をいつでも埋めたりすることができます.
高さと幅1000 pxのブラウザで80 vw(800 px)の正方形領域を作成したとします.このとき高さは500 pxに減少し、vwは影響を受けない.高さ500 px、幅1000 pxの場合、80 vwは依然として800 pxであるため、コンテンツはより低い高さで遮断されて表示される.
逆に、80 vmin(800 px)の正方形領域を作成します.1 vhと1 vwはいずれも8 pxであるため、1 vminは1 vw=1 vhである.高さが500 pxに減少すると、vhとvwの最小値はvhになり、1 vmin=1 vh=5 pxになります.コンテンツ正方形は80 vmin(400 px)である.つまり、あなたはいつもスクリーンで画面全体を見ることができます.
em/rem
Emとremは、フォントを基準に比例した大きさです.
1 emは親のフォントサイズで計算されます.はい、親のフォントサイズが16 pxの場合、1 emは16 pxです.
1 remはhtmlのトップレベル要素、root要素のフォントサイズに比例します.1 remはhtml要素で指定したフォントサイズです.
通常emは計算が面倒なのでremをよく使います.htmlのフォントサイズを62.5%に指定すると、1 remは10 pxになり、書きやすくなります.

html { font-size: 62.5%; }

これは、フォント計算をより便利にするためです.ブラウザに格納されるデフォルトのフォントサイズは16 pxで、計算が容易な10 pxです.