Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】code要素の使い方

code要素の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

codeオブジェクトは、コンピュータコードの短い断片を表すオブジェクトです。このHTML要素は、プログラミング言語のコード、変数名、ファイル名、XML要素名、またはコンピュータによって認識されるその他のテキストなど、技術的な内容を示すために使用されます。文書内でインラインに配置されるような、比較的短いコード片や単一のキーワード、専門用語をマークアップする際に特に有用です。

ウェブブラウザは、一般的にcode要素で囲まれたテキストを等幅フォント(monospace font)で表示します。これにより、通常のテキストと区別され、その内容がコードであることを視覚的にユーザーに伝えます。

整形済みの複数行にわたる長いコードブロックを表示したい場合は、code要素を<pre>要素の内部に含めて使用することが推奨されます。<pre>要素は、テキストの改行や空白をそのまま表示する機能があり、これとcode要素を組み合わせることで、プログラミングコードの構造と内容を正確に、かつセマンティックに表現できます。このように、codeオブジェクトはウェブページにおける技術文書の可読性を高める上で重要な役割を担っています。

公式リファレンス: <code>: The Inline Code element

構文(syntax)

1<code>const greeting = "Hello, world!";</code>

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ