学びBAR
  • Home
  • WEB関連知識のスキルアップ
    • Udemy 開催講座 >
      • HTML,CSSルール基礎知識 >
        • Udemy 1800円受講クーポン
    • セマンティックHTMLとは?
    • HTML特殊文字コード表
  • ストリートアカデミー講座
    • HTMLルール基礎 4h テキストダウンロード
  • 学びBARについて
  • コラム
  • お問合せ
HOME / WEB関連知識のスキルアップ / HTMLクイック・リファレンス / HTML5(目的別) / <samp>

HTML5  <kbd>

<kbd>タグは、ユーザーが入力する内容であることを示す際に使用します。 主にキーボード入力ですが、音声コマンドなどの他の方法による入力を表すために使用されることもあるでしょう。

■HTML4.01からHTML5へのバージョンアップによる変更点

kbd要素は、HTML5ではsamp要素との入れ子関係や、kbd要素同士を入れ子にするかどうかで、以下のように意味が定義されています。
<samp>~</samp>の中に<kbd>を配置した場合には、システムによって返された入力内容を表します。 <kbd>~</kbd>の中に<samp>を配置した場合には、呼び出しメニューなどのシステム出力からの入力内容を表します。 <kbd>~</kbd>の中にさらに<kbd>を配置した場合には、キーボードのキーなどの入力の一単位を表します。
例えば、ユーザーにShiftという文字列を入力してもらいたい場合と、 [Shift]キーを押してもらいたい場合と、 [S][h][i][f][t]という5つのキーを順に押してもらいたい場合は、 <kbd>タグの入れ子の仕方でマークアップし分けることができます。
HTMLソース
<p><kbd>Shift</kbd>という文字列を入力してください。</p>
<p><kbd><kbd>Shift</kbd></kbd>キーを1回押してください。</p>
<p><kbd><kbd>S</kbd><kbd>h</kbd><kbd>i</kbd><kbd>f</kbd><kbd>t</kbd></kbd>と5つのキーを順に1回ずつ押してください。</p>
↓↓↓
ブラウザ上の表示

Shiftという文字列を入力してください。

Shiftキーを1回押してください。

Shiftと5つのキーを順に1回ずつ押してください。

■使用例

HTMLソース
<p>このウィンドウを閉じるには、<kbd><kbd>ALT</kbd>+<kbd>F4</kbd></kbd>を押してください。</p>
↓↓↓
ブラウザ上の表示

このウィンドウを閉じるには、ALT+F4を押してください。

HOME                      ABOUT                      SERVICES                      UPDATES                     CONTACT
画像
1996-2024(c)Cre'ps design lab.  All rights reserved.
  • Home
  • WEB関連知識のスキルアップ
    • Udemy 開催講座 >
      • HTML,CSSルール基礎知識 >
        • Udemy 1800円受講クーポン
    • セマンティックHTMLとは?
    • HTML特殊文字コード表
  • ストリートアカデミー講座
    • HTMLルール基礎 4h テキストダウンロード
  • 学びBARについて
  • コラム
  • お問合せ