【簡潔】HTMLのimgタグについて
HTMLのimgタグについて
この記事ではHTMLのimgタグについて簡潔にサクッと学習することができます。
それでは見ていきましょう。
【imgタグについて】
下記のようなコードがあったとします。
<img src="img/tvxq_header.jpg">
これについて分解して解説します。
まずimg
ですが、このタグは終了タグを持たないので空要素と呼ばれたりします。
次にsrc
は source の略で後に続けて画像ファイルを指定します。
今回で言う画像ファイルはimg/tvxq_header.jpg
にあたります。
次にsrc
の後に=
を続けます。
最後に続けて"
で画像ファイルを囲んで要素の完成です。
src
は属性名にあたり、"img/tvxq_header.jpg"
は属性の値にあたります。
また、それら2つを合わせたものを属性と呼びます。
今回で言うとsrc="img/tvxq_header.jpg"
にあたりますね。
以下にまとめました。↓
src | "img/tvxq_header.jpg" | src="img/tvxq_header.jpg" |
---|---|---|
属性名 | 属性の値 | 属性 |
【属性の値の指定】
このようなファイルの構造だったとします。
index.html
と同じ階層にあるのがimgフォルダ
ですね。
tvxq_header.jpg
はindex.html
の1つしたの階層にあることになります。
よって今回の属性の値は"img/tvxq_header.jpg"
になります。
もし仮に、imgフォルダ
が無くてindex.html
と同じ階層にtvxq_header.jpg
があった場合は、src="tvxq_header.jpg"
になります。
最後に今回のコードをブラウザで表示したらどうなるかを載せておきます。
記事を読んでいただいてありがとうございました。
Author And Source
この問題について(【簡潔】HTMLのimgタグについて), 我々は、より多くの情報をここで見つけました https://qiita.com/suguru6213/items/6ab9bbbcc201a836e6b7著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .