HTML

HTML

画像タグ

<img src="画像パス" width="幅(px)" height="高さ(px)" alt="代替えテキスト">
    • img :image
    • src :source

何の略なのか、本質を考えられると理解が早くなる。

imgタグはインライン要素なので、<p></p>などのブロック要素で囲う

<!DOCTYPE html>
<head lang="ja">
<meta charset="utf-8">
<title>はじめてのHTML：画像を表示</title>
</head>
<body>
<h1>画像を表示</h1>
<p>HTML内に画像を表示する記述</p>
<p><img src="img/glass.jpg" width="400" height="250" alt="めがね"></p>
</body>
</html>

HTMLリンク

ハイパーリンクタグ
<a href="#">○○</a>
    • a : anchor
    • href : hyper reference

＊リンクをするためのタグ
＊aタグもimg同様、インライン要素なので<p></p>などのブロック要素で囲う

リンクタグの種類
  • テキストリンク
<a href="http://www.yahoo.co.jp/">yahoo japan</a>
  • 画像リンク
<a href="http://www.yahoo.co.jp/"><img src="画像パス" width="" height="" alt="yahoo"></a>
  • mailリンク(現在はあまり使用されていない)

その他memo

  • htmlタグでスペースを入れたい場合： （ノンブレークスペース）
  • <br>(多くて2つまで)をたくさん入れてはいけない。WEBサイトの中で空白を作る際にはCSSで決めていく。