- 1. 概要
- 2. 書いてみる
1. 概要
特に書くべきこともなく。
使ったことなかったんで知らなかったな～ちゅうだけの話です。
「MDN web docs」によれば、『ユーザーの入力を表しており、ブラウザーの既定の等幅フォントで表示するインライン要素を生成します。』とのことです。
2. 書いてみる
修飾なしで書いてみると
Ctrl+C
こんな感じですな。
ちょっと気に入ったのが、ウィキペディアの装飾です。
装飾なので「CSS」の項に書くべきかもしれないのですが、真似してみます。
Ctrl+C
こんな感じ。うむ。おされ。（Firefox でみた感じですよ）
本サイト用にアレンジ
Ctrl+C
本サイトのデフォルトはもう少しいじるかもしれませんが下記にサンプルを載せておきます。
（CSS の記述に著作権ないですよね？一応参考サイト「CSSで著作権を考える（一般向け） 」）
kbd
{
border: 1px solid #aaa;
border-radius: 2px;
box-shadow: 1px 2px 2px #ddd;
background-color: #f9f9f9;
background-image: linear-gradient(to right bottom, #eee, #f9f9f9, #eee);
padding: 1px 3px;
font-family: monospace;
font-weight: bold;
font-size: 0.85em;
color: black;
}
べたな「.css」は、もっと修飾が多いのですが、そこは「Autoprefixer」でベンダープレフィックスをつけることにしました。
|
|
