画像とリストの追加

画像とリストの追加

このページでは、画像の挿入方法とリストの作成方法について学びます。

画像の挿入

画像は、<img>タグで挿入できます。画像のURLは、src属性で指定します。また、画像の代替テキストは、alt属性で指定します。

例:

<img src="example.jpg" alt="サンプル画像">

さて、以下の演習問題に取り組んで、理解度を確認しましょう。

演習問題1

画像を挿入するコードを記述してください。画像のURLは”https://example.com/image.jpg”、代替テキストは”サンプル画像”とします。

リストの作成

順序付きリストは、<ol>タグで作成でき、リスト項目は<li>タグで指定します。無順序リストは、<ul>タグで作成できます。

例:

<ol>
  <li>順序付きリストの項目1</li>
  <li>順序付きリストの項目2</li>
</ol>
<ul>
  <li>無順序リストの項目1</li>
  <li>無順序リストの項目2</li>
</ul>

さて、以下の演習問題に取り組んで、理解度を確認しましょう。

演習問題2

以下の文章を順序付きリストに変換してください。

1. HTMLを学ぶ
2. CSSを学ぶ
3. JavaScriptを学ぶ

演習問題1の解答例:

<img src="https://example.com/image.jpg" alt="サンプル画像">

演習問題2の解答例:

<ol>
<li>HTMLを学ぶ</li>
<li>CSSを学ぶ</li>
<li>JavaScriptを学ぶ</li>
</ol>