投稿

10月, 2023の投稿を表示しています

10月25日(水)2コマ目

イメージ
今日、やったこと フォントの色、サイズ等を変える 今日のホワイトボード 前回からフォントの色、大きさ等の変更方法をやってます。 色、大きさ等をまとめて指定 同じ範囲のフォント色、大きさ等をまとめて指定できます。 図 フォントサイズ、色をまとめて指定 style属性に  項目名1:設定値1 ; 項目名2:設定値2 ; のように ; 区切りで複数指定することができます。 <span></span>のなかに<span></span> タグは入れ子(ネスト、マトリョーシカ的)にできます。 入れ子になっている場合、一番内側の開始タグ、終了タグがペアになり、その外側の開始タグ、終了タグがペアになり、・・とペアリングされていきます。 図 <span></span>のなかに<span></span>(タグの入れ子) 練習問題 正解例をあげておきます。 次回は フォントサイズや色を変えるの続きです。 

10月18日(水)2コマ目

イメージ
今日、やったこと [練習問題]ぼくの名前はソラタロウ 文字の色を変える 今日のホワイトボード [練習問題]ぼくの名前はソラタロウ 全体が中央寄せになってます。中央寄せは<center>タグを使います。 横罫線は<hr>タグ。<hr>タグは開始タグ、終了タグがない単体のタグ。 改行は<br>タグ。<br>タグも開始タグ、終了タグがない単体のタグ。 図 中央寄せ、横線、改行 フォントの色を変える フォントの色を変えるには、 ①色を変える範囲を指定 ②色を指定する です。 ①色を変える範囲を指定 <span></span>で範囲を指定。 <span>タグは範囲を作るだけ、見た目には影響なし。 ②色を指定する タグの見た目を指定するにはstyle属性で指定。 図 style属性でフォント色(項目名:color)を設定 色の指定は 多くの場合、16進数(#xxxxxx)で指定します。 以下のサイトで確認してください。   WEB色見本サイト 次回は フォントの色、サイズを変えるのつづき。  

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属性で表示したい画像ファイル名を指定する。 wi...