読者です 読者をやめる 読者になる 読者になる

CSS3のtext-shadowでWindowsでもなめらかフォントを。

CSS

Windowsユーザーでブラウザのデフォルトフォントを変えてる人って結構少数派だと思いますが、多数派であるWindows+デフォルトフォント(MS明朝とかMSゴシックとか)で自サイトが見られても、Macのようななめらかな日本語フォントで表示させる方法があります。※ただしIEは除く

コードは一行

text-shadow: #999 0.1px 0.1px 1px;

これだけ。テキストにたった0.1pxの影を付けるだけで随分と見栄えが良くなります。Macと比べるのは酷ですが。ちなみに#999っていうのはあくまで一例で、#000でも#fffでもちゃんとなめらかになります。

chrome(or safari)もFirefoxOperaもtext-shadowには対応済みなのでベンダープレフィックス(-wibkitとか-mozとか-oとか)をつける必要はありません。が、IEは8ですら対応してませんので…jQuery使える環境ならなんとかなるかもしれません。

今のところこのブログ自体がライブデモになりますが、今後デザインをいじる可能性もあるので念のためサンプル画像も置いておきますね。

f:id:kk6:20101128162744p:image

CSSは久し振りにいじったのでツッコミがあればぜひともお願いします。