CSSだけでロールオーバーで日本語と英語を切り替える

はてなでは記事でstyleを使えないのでコードだけですけど

<style type="text/css">
.rollover > span[lang=en]{
	display: inline;
}
.rollover > span[lang=ja]{
	display: none;
}
.rollover:hover > span[lang=en]{
	display: none;
}
.rollover:hover > span[lang=ja]{
	display: inline;
}
</style>

<div class="rollover">
	<span lang="en">Text</span>
	<span lang="ja">テキスト</span>
</div>

FirefoxとSafariで動作確認。IE6とかいう糞エンジンでどうなるかは知らんです。IE7なら多分大丈夫でしょう。知らないけど。
きちんとメモってないけど、書店で多分『Webデザインユーザビリティ (ウェブクリエーターズバイブルシリーズ)』を流し読みしてた際に、無闇に英語を使うなという文脈の中で「ロールオーバー」についての話が出てて(hoverで云々するのを"ロールオーバー"ということを初めて知った)、要するに、英語のメニュ−でカッコつけといてマウスが乗ったときに日本語を表示させるインターフェースも、結局マウスを乗せるまでは英語で意味分からんままだから糞なことには変わりない、という話だったんですけど、糞が糞であることはさておき、こういう機能の実現はすぐできそうだなと思ったら、やっぱりすぐできたという話です。
ぶっちゃけCSS知ってる人ならこんな記事読まなくてもできるだろうしCSS知らない人にはどうでも良い話だし、この記事は一体何の意味があるんだろうか。