HTML学習のまとめ

まず最初に、HTML とは何ですか? 正式な説明は「ハイパーテキスト マークアップ言語」です。それはどういう意味ですか？簡単に言えば、Web ページを作成するために使用される特別な言語です。では、Web ページとは何でしょうか? Web ページはブラウザ ウィンドウの下に表示されるページであり、本質的にはドキュメントです。

Web ページには主にテキスト、画像、ハイパーリンクの 3 つの要素があります。これら 3 つの要素を使用すると、最も単純な Web ページを作成できます。ただし、実際に実行する場合は、ページの形式とレイアウトをどのように制御するかという問題を考慮する必要があります。当初はいわゆる「書式制御タグ」と「テーブル」を使って実装していました。しかし、このアプローチには重大な欠点があることがすぐにわかりました。たとえば、特定のセルのフォント、色、サイズなどを変更したい場合は、それらのセルを 1 つずつ変更する必要があります。ただし、これが主要なことではありません。スクリプト言語を使用すると、別のレイアウト方法の方が有益であることがわかります。変更したい部分をより簡単に見つけることができるからです。

ここで、別のレイアウト方法である div+css スタイルシートを考えてみましょう。まず、このアプローチの利点の例を示します。 1. 再現性が高く、何度でも引用可能。 2. コンテンツとフォーマットの分離を実現します。 3. 正確な制御と高速な検索速度。次に使い方を考えてみましょう。最も簡単な方法は、div タグにスタイルを直接記述し、内容に従うことです。しかし、これではこのレイアウト方法の利点が見えてきません。最善の方法は、head 内または外部にスタイルを記述し、それを参照することです。ここで 2 つのセレクターについて言及する必要があります。 1 つはクラス セレクター、もう 1 つは ID セレクターです。スタイル シートに配置されたこれらのセレクターを通じて、スタイルを正確に操作します。詳細には立ち入らず、それらの違いについてのみ説明します。簡単に言えば、class はクラスであり、複数回参照できます。id は ID であり、1 回だけ参照できます。実際、それを本当にわかりやすく説明するには、具体的な例を組み合わせる必要があります。

最後に、スクリプト言語である「JavaScript」について考えてみましょう。まず、スクリプト言語とは何でしょうか?用途は何ですか?次のシナリオを考えてみましょう。Web サイトを作成し、正常に公開しました。ユーザーはテキスト ボックスに正しい情報を入力し、[送信] をクリックしましたが、何も起こらなかったことがわかりました。これはもちろん、反応やアクションを書いていないからです。スクリプト言語はまさにこの種の反応やアクションを実現するために存在します。言い換えれば、スクリプト言語の存在は絶対に必要です。実は、この用法以外にも、もっと一般的な用法があります。前に述べたように、ID またはクラスを通じて特定のラベルのスタイルを制御できます。同様に、スクリプト言語を通じて ID またはクラスを見つけ、特定のタグのスタイルを対話的に操作できます。

以上がWebページ制作の基本的な内容、つまりHTML(コンテンツ)、CSS(スタイル)、JS(スクリプト/アクション)です。