CSSだけでキーボードのキーを表現する方法

タイトルがわかりにくいかな。まあいいや。 「方法」などとエラそうに言うほどのものじゃないんだけど やってみたら何かそれっぽく見える気がしてきたので一応書いときます。 要するに何がやりたいのか ブログなんかの文中で 「このキーを押すんだよ」ということを伝えようとして そのキーに刻印された文字を示すことがある。 でもそのままではキーっぽく見えないので、 それ用のスタイルを用意して 何となくキーに見えるようにしたい。 つまりこのようなことが言いたいときに Shift + ⌘ + 3 で画面をキャプチャーします。 このように表示したいということ。 Shift + ⌘ + 3 で画面をキャプチャーします。 CSS 非対応のフィードリーダーで読んでたらわからんと思うのでサイトに来てください。 あと IE6 だと ⌘ ←が出ませんねごめんなさい。”Command” と読み替えてください。 どのタグを使う

[warriorking]

CSSだけで文中のキーボードのキーがそれっぽく見えるようにする方法 - 頭ん中

[ngsw]

いいことをしった

[hisasann]

borderの使い方でキーっぽくなる

[qnighy]

これいいなー

[simsons]

<kbd> タグの定義とは違うので、ってことで。

[forestk]

あわせて書きたい： .key:active { border-width: 2px 1px 1px 2px; background-color: #CCC; }

[totobook]

これはとても素敵