記事内に広告が含まれています。

文字をキーボード風に表示【simplicity2】

simplicity2
記事内に広告が含まれています。

キーボードのキーの入力を説明する場合、文字だけでは味気ないのでキーボード風に装飾すると見やすく、お洒落になります。


普通に入力 Ctrl + C
キーボード風 Ctrl + C

 

simplicityでは最初からキーボード風のタグが用意されているので、とっても助かります。

サイトSimplicityの基本的な文章装飾スタイルを使う方法まとめ

 

スポンサーリンク

タグを使いキーボードのキーのような文字を表現

投稿編集ページのタグ欄にあるキーボードを利用します。
キーボードを押すと<span class=”keyboard-key”>
もう一度押すと</span>が入力されタグが閉じます。
キーボード風に装飾したい文字をタグの間に入力します。

 

 

<span class="keyboard-key">ここに文字入力</span>
<span class="keyboard-key">Ctrl</span> + <span class="keyboard-key">C</span>

ここに文字入力
Ctrl + C

このように表示されます。

 

もし、キーボード風に表示されていない場合は、キャッシュクリアすると表示される場合があります。

CSSでキーボードタグのスタイルを変更

CSSで大きさや影など変更も可能です。

私の場合ですが、デフォルトより少し大きくして影も濃くしています。

/* キーボード風スタイル */
.keyboard-key {
	padding: 0px 12px;
	margin: 0 4px;
	box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.5);
}

 

 

他テーマでもCSSで簡単にキーボード風の文字を入力できます。

CSSで簡単にキーボードのキーを表示
キーボードのキーの説明したいときに、わかりやすくオシャレに表現することができます。 例 普通に入力 Ctrl + C キーボード風 Ctrl + C CSSをカスタマイズしてキーボード風文字に CSS /* keyboard */ .key...
ゲームのラグ解消!おすすめネット回線
オンラインゲームに最適な回線【NURO光】
ポイント
  • 最大2Gbpsの超高速回線
  • 独自配線網利用で安定性が高い
最大速度 最大2Gbps
月額料金 5,200円
キャッシュバック 45,000円
基本工事費 実質無料
セット割 でんき・ガス・ソフトバンク携帯
他社解約金還元 最大20,000円

最大2Gbpsの高速回線と、独自整備のネットワーク網で混雑が少なく安定してゲームを楽しめる回線です。キャッシュバックやセットサービスなども豊富。PlayStation5のレンタルやソニー製Wi-Fiルーターに対応しているのも魅力的です。

独自ネットワークで混雑しにくい【auひかり】
ポイント
  • KDDI独自回線でピーク時も安定
  • au・UQモバイルユーザーにおすすめ
最大速度 最大1Gbps
月額料金 戸建て:6,160円
(マンション:4,180円)
キャッシュバック 最大70,000円
基本工事費 月額料金に含まれる(割引含む)
セット割 au・UQモバイル
他社解約金還元 最大30,000円

KDDI独自の回線網で夜間のピーク時でも高速&安定!最大1Gbpsの回線の中でも1番速度がでやすいと評判です。

全国どこでも利用可能でフレッツ光よりも安い!【SoftBank 光】
ポイント
  • NTT回線だから全国の広いエリアで利用可能
  • ソフトバンク・ワイモバイルユーザーにおすすめ
最大速度 最大1Gbps
月額料金 戸建て:5,720円
(マンション:4,180円)
キャッシュバック 25,000円
基本工事費 最大26,400円(のりかえ新規)
セット割 ソフトバンク・ワイモバイル
他社解約金還元 満額還元

エリアの限られている【NURO光】や【auひかり】が利用できない方におすすめなのが【SoftBank 光】。NTT光回線使用でほぼ全国どこでも利用可能。しかも、IPoE(IPv6)接続だからNTT回線の混雑を受けずに高速・安定して利用できます。

simplicity2
スポンサーリンク
トロネコのトロコン部屋

コメント

タイトルとURLをコピーしました