4.1a、hrefタグ

そうですね、私たちは皆さんの中から Java プログラマーを準備していることを忘れていません。そのため、学習する必要があるのは 5 つのタグだけです。

まず、これはテキストをハイパーテキストに変換する最も重要なタグです - link。HTML でリンクを作成するには、タグ<a>(アンカー、アンカー) が使用されます。

デフォルトのリンクは次のようになります。

<a href="link-address">link text</a>

ここで、青はユーザーに表示されるテキスト、はリンクのテキストをクリックした場合に移動するアドレス (リンク) です。

リンクを含む一般的な HTML ドキュメントは次のようになります。

<html>
    plain text
        <a href="http://codegym.cc/about">
            Link to something interesting
          </a>
     some other text...
</html>

いいえ、通常は次のようになります。

<html>
    plain text  <a href="http://codegym.cc/about">Link to something interesting</a> some other text...
</html>

世界は完璧ではありません。

4.2 imgタグとsrc属性

HTML ページに画像を挿入するには、<img>(image という単語からの) タグが使用されます。これは単一のタグであり、終了タグはありません。タグの全体像:

<img src="image link">

すべてはとてもシンプルです。HTML ドキュメントに画像を表示するには、その画像へのリンクを知っていて、img. 試してみてください、きっと気に入っていただけるでしょう。

4.3 テーブル要素

また、HTML ページにはデータを含むテーブルを含めることができます。しかし、よく考えてみると、ここでは 1 つのタグだけでは済まされません。結局のところ、テーブルにはヘッダー、行、列、セルがあります。彼らは皆、独自のタグを考え出しました。

  • <table>- テーブル自体。
  • <tr>( table row ) –行テーブル。
  • <th>( table h header ) – テーブルヘッダーセル。
  • <td>(テーブルデータ) – テーブルのセル。

3 x 3 のテーブルは次のようになりますhtml(ヘッダー行が追加されています)。

<table>
    <tr> <th>Surname</th> <th>Name</th> <th>Surname</th> </tr>
    <tr> <td>Ivanov</td> <td>Ivan</td> <td>Ivanovich</td> </tr>
    <tr> <td>Petrov</td> <td>Peter</td> <td>Peterovich</td> </tr>
    <tr> <td>Sidorov</td> <td>Kolia</td> <td>Sidorenko</td> </tr>
</table>

今ではテーブルはほとんど使用されませんが。携帯電話からページを表示する場合、表を別の方法で表示すると便利です (画面に収まらないだけです)。ただし、テーブルがどのように配置されているかを知る必要があります。

4.4 id 属性と name 属性

さらに 2 つの重要な点は、idと属性ですname。これらはタグではなく属性ですが、非常に頻繁に使用されます。

idtag属性を使用すると、ドキュメント全体内で一意の名前を付けることができます。これは、HTML ドキュメント内に、指定されたタグの値またはパラメータを変更する JavaScript が含まれている場合に便利です。その後、 unique の助けを借りて、id目的のタグを正確に参照することができます。

属性もname同様の機能を実行しますが、その値はページ内で一意である必要はありません。つまり、理論的には、同じ名前のタグが複数存在する可能性があります。これは、要素のグループの操作を容易にするために行われます。

たとえば、ページには複数のリストがあり、それぞれのリストで項目を 1 つだけ選択できます。次に、リスト内の新しい要素を選択するときに、リストの残りの要素の選択をリセットする必要があります。ただし、他のリストには触れないでください。同じリストのすべての要素が同じ名前を持つ場合、これは簡単に実行できます。

idどのタグにも と の両方の属性を含めることができますname。例:

<img id="image123" name="avatar" src="link to picture">