シェルでコマンドを入力して、そのコマンドの出力結果までの一連の流れをHTML5で正しくマークアップするには、次のように行います。
<pre><samp>[root@www ~]# <kbd>stat /var/log/messages</kbd> File: `/var/log/messages' Size: 152 Blocks: 8 IO Block: 4096 通常ファイル Device: c2h/194d Inode: 20710611 Links: 1 Access: (0600/-rw-------) Uid: ( 0/ root) Gid: ( 0/ root) Access: 2018-12-02 04:02:03.000000000 +0900 Modify: 2018-12-02 04:02:03.000000000 +0900 Change: 2018-12-02 04:02:03.000000000 +0900 [root@www ~]#</samp></pre>
samp要素はプログラムやシステムからの出力例を表します。したがって、シェルからの出力部分全体をsamp要素で囲みます。
kbd要素はユーザーの入力を表します。 特にkbd要素がsamp要素内にネストされる場合は、ユーザー入力をシステムがエコーしていることを表しますので「stat /var/log/messages」の部分はkbd要素で囲みます。 「stat /var/log/messages」の部分は、シェルがエコーで出力している部分なので、samp要素の中にも含まれているのは理にかなっています。
シェルからの出力部分はそのままHTMLで表示したいので、一番外側はpre要素で囲みます。 pre要素は整形済みテキストを表し、ホワイトスペースなども含め書いたとおりにそのまま表示されます。