おはようございます!
7月31日 水曜日。相変わらず晴れ🌞
最高気温36℃。暑いな~ほんとに。
昔はよくまあ夏に外で遊んでたよな~。
ってことで調べてみました。
Copilot!1990年7月の最高気温の平均は?
まじか。最高気温の”平均”が30.1℃か。
Copilotってたまに嘘言ってくるからリンク先行ってみたら気象庁でした。
どうやらホントっぽい。ってかホント。
リンク先の表を見ると、1990年7月は最高気温が34.6℃。(7月19日)
今は連日36℃以上なんだが。。。ε-(≡Д≡;)ハァァ….
※夏のイラストを貼り付けてお茶を濁すとする。
さあ!今日もやっていきます!
今日の教材も変わらずこちら、
よしやっていこう。
CHAPTER2 Webの基本構造を作る!HTMLの基本
◆HTMLの基本文法とタグ
HTMLはタグを使って要素を定義する。タグは、<タグ名>の形式で書かれ(開始タグ)、最後に</タグ名>を記載する(終了タグ)。
※終了タグがないものもある。
<タグ名> コンテンツ内容 </タグ名>
開始タグ 終了タグ
◆タグを書くときのルール
・半角英数字で書く
ファイル名と同様、タグに全角文字を使うことはできない。
・大文字と小文字
基本的に大文字と小文字の区別はない。<div>と<DIV>は同じ意味を持つ。ただし、HTML5の標準では、タグ名や属性名は小文字で記述することが推奨されている。
一方で、属性値は大文字と小文字を区別する。例えば、「class=”example”」と「class=”Example”」は異なるものとして扱われる。
◆タグの中にあるタグ
HTMLでは、開始タグと終了タグの間に別のタグを記述することが多々ある。このような書き方を入れ子という。
<入れ子の例>
<p>
<strong>
入れ子
</strong>
の書き方
</p>
※<strong>タグは太字(ボールド)で表示される。「入れ子」が太字になる。
<入れ子の不適切な例1>
<p>
<strong>
入れ子
</p>
の書き方
</strong>
※手前にあるタグ(上記の場合、<strong>)から終了していないのでNG。
<入れ子の不適切な例2>
<p>
これは段落です。
<div>これは不適切なネストです。</div>
</p>
※<p>タグ(段落タグ)の中に<div>タグを入れるのは不適切。段落タグは、ブロックレベル要素を含むことができない。
<入れ子の不適切な例3>
<ul>
<li>リストアイテム1
<li>リストアイテム2</li>
</li>
</ul>
※<li>タグ(リストアイテムタグ)の中に別の<li>タグを直接入れるのはNG。リストアイテムは、<ul>(順序なしリスト)または<ol>(順序付きリスト)の直接の子要素である必要がある。
<入れ子の不適切な例4>
<table>
<tr>
<td>セル1
<tr>
<td>セル2</td>
</tr>
</td>
</tr>
</table>
※<tr>タグ(テーブル行タグ)は、<table>または<tbody>の直接の子要素である必要がある。セル<td>の中に行<tr>を入れるのはNG。
◆タグに情報を書き加える
タグによっては、開始タグの中にそのタグについての付加情報を書くこともある。この情報の種類のことを「属性」といい、タグ名のあとにスペースを空けてから記述する。
また、記述した属性の”情報”のことを「値」といい、「”(ダブルクォーテーション」で囲んで記述する。
※属性はタグによって異なる。
<属性と値の例1(クラス属性)>
<div class=”container”>コンテンツ</div>
要素にCSSスタイルを適用するために使用。
<属性と値の例2(ID属性)>
<div id=”header”>ヘッダー</div>
要素に一意の識別子を付けるために使用さる。JavaScriptやCSSで特定の要素を操作する際に便利。
<属性と値の例3(リンク属性)>
<a href=”https://example.com”>リンク</a>
<a>タグ(アンカータグ、リンクタグ)でリンク先のURLを指定するために使用される。
<属性と値の例4(画像属性)>
<img src=”image.jpg” alt=”説明文”>
<img>タグで画像のURLと代替テキストを指定するために使用される。
<属性と値の例5(スタイル属性)>
<p style=”color: red;”>赤いテキスト</p>
要素にインラインスタイルを適用するために使用される。
<属性と値の例6(タイトル属性)>
<abbr title=”HyperText Markup Language”>HTML</abbr>
要素にツールチップを追加するために使用される。マウスを要素の上に置くと表示される。※<abbr>タグ:「略語タグ」「アブリビエーションタグ」
情報を付け加えてたらボリュームがデカくなってしまったため、これにて終了です。
明日から8月か~。
8月越えたら秋が来てあっという間に年末か~。早いな~。光陰矢の如し。
おつかれさまでした~(=゚ω゚)ノ
コメント