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
。これらはタグではなく属性ですが、非常に頻繁に使用されます。
id
tag属性を使用すると、ドキュメント全体内で一意の名前を付けることができます。これは、HTML ドキュメント内に、指定されたタグの値またはパラメータを変更する JavaScript が含まれている場合に便利です。その後、 unique の助けを借りて、id
目的のタグを正確に参照することができます。
属性もname
同様の機能を実行しますが、その値はページ内で一意である必要はありません。つまり、理論的には、同じ名前のタグが複数存在する可能性があります。これは、要素のグループの操作を容易にするために行われます。
たとえば、ページには複数のリストがあり、それぞれのリストで項目を 1 つだけ選択できます。次に、リスト内の新しい要素を選択するときに、リストの残りの要素の選択をリセットする必要があります。ただし、他のリストには触れないでください。同じリストのすべての要素が同じ名前を持つ場合、これは簡単に実行できます。
id
どのタグにも と の両方の属性を含めることができますname
。例:
<img id="image123" name="avatar" src="link to picture">
GO TO FULL VERSION