ホームページ  >  記事  >  ウェブフロントエンド  >  CSSにおける長さ単位間の変換に関する解析

CSSにおける長さ単位間の変換に関する解析

黄舟
黄舟オリジナル
2017-07-19 13:34:501649ブラウズ

CSSを書くときに最もよく使われる長さの単位はpx(ピクセル)で、emやptなどがよく見られますが、実はCSSにはpx、em、pt、ex、pc、inの8つの長さの単位があります。 、mm、cm。
1. px: ピクセル、デバイスの長さ単位に対する相対値、ピクセルはモニター画面の解像度に対する相対値です。
例えば、WONDOWSユーザーが使用する解像度は一般的に96ピクセル/インチです。 MAC ユーザーが使用する解像度は通常 72 ピクセル/インチです。
2. em: 相対的な長さの単位。現在のオブジェクト内のテキストに対する相対的なフォント サイズ。
現在のインラインテキストのフォントサイズが手動で設定されていない場合は、ブラウザのデフォルトのフォントサイズを基準とします。
3. pt: ポイント、長さの絶対単位。
4. 例:相対的な長さの単位。文字「x」を基準とした高さ。通常、この高さはフォント サイズの半分です。
インラインテキストの現在のフォントサイズが手動で設定されていない場合は、ブラウザのデフォルトのフォントサイズを基準とします。
5.pc:パイカ、長さの絶対単位。我が国の新4号型に相当します。
6. in:インチ(インチ)、長さの絶対単位。
7. mm: ミリメートル、長さの絶対単位。
8.cm:センチメートル、長さの絶対単位。
そのうち: 1in = 2.54cm = 25.4 mm = 72pt = 6pc;
コンテナのサイズの単位として px を使用することがよくありますが、実際には、多くの人が px をフォント サイズの単位として使用します。フォント単位として px を使用する唯一の致命的な欠点は、ブラウザのフォント ズーム機能が IE では使用できないことです。
しかし、フォント単位がpxであることと、IE下でブラウザのフォントスケーリング機能が使えないことのデメリットは、もはやそれほど重要ではなくなっているのではないかと個人的には思っています。新しいバージョンの IE7 と IE8 は、Firefox を含む Web ページ全体のズーム機能をすでにサポートしています。デフォルトでは、フォント サイズを拡大縮小するのではなく、Web ページ全体をズームします。単純にフォント サイズを拡大縮小しないことに意味はありますか。 Ctrl + マウスの中央をスクロールします。IE が改良されました

実際、CSS には 8 つの長さの単位があります。つまり、px、em、pt、pc、in、mm、cm です。ピクセル (Pixel)、相対値 モニター画面の解像度に対するデバイスの長さ (ピクセル単位)。たとえば、WONDOWS ユーザーが使用する解像度は通常 96 ピクセル/インチです。 MAC ユーザーが使用する解像度は通常 72 ピクセル/インチです。
em: 相対的な長さの単位。現在のオブジェクト内のテキストに対する相対的なフォント サイズ。現在のインライン テキストのフォント サイズが手動で設定されていない場合は、ブラウザのデフォルトのフォント サイズを基準とします。
例: 相対的な長さの単位。文字「x」を基準とした高さ。通常、この高さはフォント サイズの半分です。インライン テキストの現在のフォント サイズが手動で設定されていない場合は、ブラウザのデフォルトのフォント サイズを基準とします。
pt: ポイント、長さの絶対単位。
pc: パイカ、長さの絶対単位。我が国の新4号型に相当します。
in: インチ、長さの絶対単位。
mm: ミリメートル、長さの絶対単位。
cm: センチメートル、長さの絶対単位。
そのうち: 1in = 2.54cm = 25.4 mm = 72pt = 6pc;
私たちはコンテナのサイズの単位として px を使用することが多く、国内の多くの人はフォント サイズの単位として px を使用します。 -size) ですが、実際には px を使用します。フォント単位を作成する唯一の致命的な欠点は、ブラウザのフォント スケーリング機能が IE では使用できないことです。または、Ctrl を押したままマウスの中央のホイールをスクロールします。
非常に多くの人が HTML EM 単位の使用を推奨していますが、ピクセルの使用に慣れている人にとっては、決して便利ではありません。参考までにいくつかの変換式と比較表を示します。

以上がCSSにおける長さ単位間の変換に関する解析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。