3D Text
CSSでテキストを3D表示する 3D Text というサイトがあったので、日本語も表示してみた。
Chrome Windows
Chrome Mac
CSSには関係無いのですが、さすがに Mac は綺麗に見えます。
Text という部分のカーニング（文字詰め）もうまい具合にやってくれますね。
Updates from 1月, 2011 Toggle Comment Threads | キーボードショートカット
-
someeda
-
someeda
CSS Tips:コメントアウト
ふつー、CSSのコメントは
/* */、もしくは <!– –>で囲う。（W3C:Comments)
が、しかしだ、こんな方法で行う事もできる。
A trick I use all the time to temporarily disable a style attribute involves simply adding an ‘x’ in front of the attribute name. It’s safer then cutting and quicker then commenting out:
1
2
3
4
5
6
7#footer{
border-top: 1px solid #e5e5e5;
xborder-bottom: 1px solid #e5e5e5;
}Squeaky Clean CSS
border-bottom属性をコメントアウトするのに、先頭に’x'を付けている。なるほど、文法が間違っているわけでは無いから、こういう方法もあるのか。知らない人が見たらコメントだとも思えないのが欠点だけど、作業中のスピードアップが計れるのが良い所。
実際に仕事で使うとしたら、リリースする時に実行するスクリプトというのを作って、自動で’x'が先頭に付いた属性を削除するべきかな。これをそのまま納品するのは避けないと。納品前にはlintで文法チェックしすべし。（Webアプリケーションではみんなどうしているんだろう、ふと疑問に思った。）
Squeaky Clean CSSでは他のTipsもあって、CSSを見やすくするためのグループ化、インデントで見やすくする、<div>タグを閉じる方にid名をコメントで記述する等、ありがちではあるけど大事な事ばかり。インデントのスタイルに関してはそれぞれポリシーもあるだろうけど、書いた人の考えが出てくる部分でもあるので、結構他人の書き方は参考になる。
CSSセレクタの指定が重なる時に優先されるのは？
Squeaky Clean CSSからリンクされていた、他のページにも面白い記事があった。CSSではidやclass、タグを指定（セレクタと呼ばれる機能）して、色や大きさ等の属性を設定するのだが。指定が重なった時には何が優先されるのかを、この記事では解説してた。しかもスターウォーズに例えて!
Join me, and together we can rule the galaxy as father and geeks!
内容はともかく、話のたとえでスターウォーズの画像を作って掲載されているので。まずはそちらをチェック。
一応自分のために内容を要約しておくけど。このページによればCSSのセレクタのそれぞれを、idは1、classは10、タグは100と考えて、それぞれを足した数の大きい方が優先されるのだとか。タグの指定が一番強力という事になる。
しかしこの記事のコメントを見て行くと、どうもこれは正確な話では無いらしい。あんまり沢山書いてあってとても読んでいられなかったけど、タグ＞class＞idという関係があるんだな〜という程度を知っていれば、とりあえずは十分かと。
きちんと知りたい人は、迷わずhttp://www.w3.org/へ！