YUI 3のCSS Fontsを使っている場合のフォントサイズ対応表をCSSのコメントに書いておくと便利ですよね
CSSでフォントサイズの指定って何でしてますか？っていうのは何年も前からある話題で最近は全然見ないですけど、特にそういう議論をしたいわけじゃなくて。
僕はYUI 3のCSS Fontsを使っていますが、%指定になるので実際何pxになるのかCSSだけでは分かりにくいときもあるので、共通CSSに下記のようなコメントでpx対応テーブルを書いておくとすぐに指定できてわかりやすいと思いますが、皆さんどうしてますか？
はYUI 3のページから持ってきて使ってますが、26pxまでしかないのがたまに不便かもですね。普通のサイト作ってるときは26px以上ってあまり使わないので困らないですけど。
共通CSSに記載するpx対応テーブル
/*-----------------------------------------------------------
hoge.css
フォントサイズの指定はYUI Fontsに基づき
下記テーブルで指定します
|px|%|
|10|77|
|11|85|
|12|93|
|13|100|
|14|108|
|15|116|
|16|123.1|
|17|131|
|18|138.5|
|19|146.5|
|20|153.9|
|21|161.6|
|22|167|
|23|174|
|24|182|
|25|189|
|26|197|
ex) 12px
element {
font-size: 93%;
}
------------------------------------------------------------*/
あとは共通CSSで
div.main {
font-size: 93%; /* 12px */
}
とかにしたら、モジュールとか個別CSSでは最初のコメントにそれ書いておくと分かりやすいですね。
リンク
何か役に立つことがあったらシェアしてみてください
Leave a comment
Trackbacks: 1
- Trackback URL for this entry
- Listed below are links to weblogs that reference
- YUI 3のCSS Fontsを使っている場合のフォントサイズ対応表をCSSのコメントに書いておくと便利ですよね from 5509
-
trackback from jmblog.jp YUI の CSS Fonts を使う場合は Scss を利用すると管理しやすいよ
YUI 3のCSS Fontsを使っている場合のフォントサイズ対応表をCSSのコメントに書いておくと便利ですよね :: 5509 というエントリーを見て、それ Scss を使うと便利だよと思ったので、ご紹介。
_f…
Comments: 4 - Leave a comment
This is a good tip especially to those fresh to the blogosphere.
Brief but very accurate info… Thank you for sharing this one.
A must read post!
大変参考になりました。ありがとうございます！
いつもレベルの高いエントリー、楽しく読ませてもらってます。
私の職場ではフォントサイズの％指定の際に
下記サイトを利用してます。
http://fordinteractive.com/tools/emchart/
すでにご存知かもしれませんが。
YUI フォント調べてやって参りました。
＞http://fordinteractive.com/tools/emchart/
こちらもすごく気に入りました。
便利ーーー。
ありがとうございます！