4.css計測単位_html/css_WEB-ITnose

CSS の長さの設定では、多くの場合、測定単位、つまりフォントや境界線の長さをどの単位でデザインするかを使用する必要があります。 CSS では、長さの単位は絶対長と相対長に分けられます。

絶対長とは、現実世界における測定単位を指します。CSS は 5 つの絶対長単位をサポートします。

長さの絶対単位

単位識別子	説明
in	インチ
cm	cm
mm	mm
pt	lbs
pc	pica

相対長さは、他のタイプの単位の基本を指し、同様に 5 つのタイプがあります。

相対的な長さの単位

単位識別子	説明
em	要素のフォントサイズに連動
ex	要素のフォント高さの「x」フック付き
rem	ルート要素のフォントサイズにフックされます
px	ピクセル、解像度にリンクされます
%	別の値に対する相対的なパーセント

一部使用しております。一般的に使用されるユニットをデモンストレーションとして使用します。デモンストレーションを行わないと基本的に役に立ちません。

1.em 相対単位

p {    margin: 0;     padding: 0;     background: silver;     font-size: 15px;     height: 2em;} 

説明: em はフォントサイズに連動した相対単位で、フォントサイズに応じてサイズが変更され、非常に柔軟です。

2.px 相対単位、絶対特性

p {    margin: 0;     padding: 0;    background: silver;    font-size: 15px;     height: 55px;} 

説明: px も相対単位ではありますが、解像度と連動しているため実際には絶対単位となり、本来の柔軟性はそれほど高くありませんただし、比較的使いやすいため、多くの開発者が愛用しています。

3.%パーセント

p {    margin: 0;    padding: 0;    background: silver;    font-size: 200%;     width: 50%;} 

説明：長さというのは分かりやすく言うと、ブロックが引っ掛かっている部分の幅のことです。また、font-size は、継承される元のサイズのパーセンテージです。