スポンサーサイト

このブログは移転しています。このエントリをEvernoteなどにファイリングされる場合は移転先のものをお使いください。ただし移転に際して一部エントリは削除しています、ご了承ください。
▶︎▶︎ このエントリの移転先に ((移動)) する
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

commandキーなどのマークをブログなどに表示する方法

このブログは移転しています。このエントリをEvernoteなどにファイリングされる場合は移転先のものをお使いください。ただし移転に際して一部エントリは削除しています、ご了承ください。
▶︎▶︎ このエントリの移転先に ((移動)) する

あまりオススメは出来ませんが使いたい場合もあるし……ネ

OS X のメニュー項目に表示されているキーボードショートカットに用いられている記号。例えば command キーは四葉みたいなデザインが使われていますね。

cap_20130512_114712.jpg
四葉みたいなのが command キー、上向きの矢印は shift キー
平仮名の "へ" みたいなのが control キー、エスカレーターみたいなのが option キー

これらの記号を画像ではなく "テキスト" としてウェブページ上に表示させたい場合は以下のように記述します。

  • command キーは『⌘』
  • shift キーは『⇧』
  • control キーは『⌃』
  • option キーは『⌥』
  • delete キーは『⌫』

※ 上のキーボードボタン風のデザインは coliss さんで紹介されていたエントリーを参考に装飾しています

実際の記入例としては以下のようになります。

(表示例)キーを押しながら Q を押すとアプリの終了
(記入例)⌘キーを押しながら Q を押すとアプリの終了

ただしこれらの記号は機種依存文字になるので、Mac OS X と iOS 以外の環境では基本的に表示されないと考えて下さい。Mac や iOS 以外の訪問者が多いならば記号による表示は避けましょう。

ちなみに上の表示例では厳密に書くと以下のように記述してあります。

<span title="command">&#x2318;</span>キーを押しながら……

こうしておくと仮に Windows 環境で command 記号が表示できていなくてもマウスオーバーする事でツールチップに "command" と表示されるので、そこに何があるのかを知ってもらえます。気休め程度ですし、見る人がマウスオーバーしてくれないと気づかれませんけど σ(^_^;)

繰り返しになりますが機種依存性が高いので使用はほどほどに。

AdSense

Ads

Blog Search

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。