※ パクレゼルヴではWeb開発エンジニアを大募集中!詳細はこちら

62.5%  

2008/5/29 木曜日 21:49:32

チョコボールです。

WEBアプリ開発においてはLAMP(Linux、Apache、MySQL、PHP)が中心ですが、モバイルコンテンツ開発がメインと言っても管理画面系は基本的にPCから操作します。
ということは、JavascriptやAjaxも扱えた方が当然アツい訳です。

プログラミングを始める前まではJavascriptはネットで拾ってきてコピペで使っていました。
使うケースが増えてきたのでこれを期にちゃんと身につけようと思って地味に勉強中です。
Javascriptについて書きたいのですがまだまだへっぽこですのでまた今度。。

今回はCSS(Cascading Style Sheets)について。

開発担当の自分はCSSは業務ではあまり触れることはないのですが、面白いので個人的に勉強してます。
綺麗なMVCモデルのWEBアプリ構築を目指してる自分としては、Vもさらに分けたいという欲求も自ずと出てくるものです。

数年前に流行りかけたテクニックらしいのですが、
『フォントサイズをピクセル単位のように直感的に相対指定する技』

たまにソースを覗くと、このような指定を見かけることがあります。

body{ font-size: 62.5%; }

一つのサイトならまだしも、他のサイトでも同じ62.5を多く見かけました。
最初はなぜ62.5%なのか!?って感じで謎でした。

こう指定することにより、ブラウザ上でフォントサイズを12pxの大きさで表示させたい場合は1.2em、14pxの大きさで表示させたい場合は1.4emのように直感的に指定すれば、ブラウザの設定でデフォルトのフォントサイズを変更してなければ、たいていの場合は望み通りの表示になってくれます。
現在、ほとんどのブラウザで大丈夫のようです。

そのメカニズムは…

現在広く使われているブラウザの殆どはデフォルトのフォントサイズが16ピクセル。
もしデフォルトの文字サイズが10ピクセルになっていたとすれば…と発見者は考えたようです。

16ピクセルを相対指定で10ピクセルに変えるには

10÷16=0.625

body要素に62.5%として指定すれば、先に示した通り、直感的に指定できることになります。

デメリットも有りますが、便利ですね。

MoriMoriMoriMori HTMLとか, Tips, その他

  1. No comments yet.
  1. No trackbacks yet.