10月4日(水)2コマ目

今日、やったこと

  • ホームページはなにでできている?
  • HTML
  • タグ
  • 簡単なHTMLファイル作成
  • 画像を表示する

今日のホワイトボード

ホームページはなにでできている?

ホームページはWebブラウザ(Google Chrome、Microsoft Edge、Apple Safari等)を使って表示する。このWebブラウザはHTMLファイルの中身をHTMLのルールに従って表示する。

ということで、

 ホームページを作る = HTMLファイルを作る

です。


HTML

Hyper Text Markup Languageの略。

HTMLはデータに意味を持たせるためのタグを決めている。

データにこのタグを使って意味づけをしたファイルがHTMLファイル。

結局、この授業はHTMLのタグを理解して使いこなすことが目的。

なお、HTMLファイルのファイル名は~.html。.htmlをつけることでこのファイルはHTMLファイルだと認識される。

図 WebブラウザとHTMLファイル

タグの基本

<h1>がタグ。HTMLではいろいろなタグが定義されている。
タグには役割が決められている。
<h1>タグは見出し。
<p>タグは段落。
多くのタグは開始タグ(<h1>や<p>)と終了タグ(</h1>や</p>)がペアになっている。
<h1>と</h1>で挟まれたデータが見出しになる。見出しなので、Webブラウザは大きな字で表示する。
図 HTMLのタグ

HTMLファイルの構造

HTMLファイルは<html>タグで始まり、</html>タグで終了する。
<html>と</html>の中に
ヘッダー部になる<head>タグと</head>タグ
本文部になる<body>タグと</body>タグ
がある。
Webブラウザに表示されるのは<body>~</body>。
図 HTMLファイルの構造

画像を表示する

画像ファイルを表示するには<img>タグを使う。
<img>タグにはsrc属性があり、このsrc属性で表示したい画像ファイル名を指定する。
width属性は画像表示の際の横幅サイズ。横幅を指定すれば縦幅も自動的に変更される。
図 <img>タグで画像ファイルを表示

次回は

HTMLファイルを作ってもらいます。





 

このブログの人気の投稿

11月29日(水)2コマ目

1月17日(水)2コマ目