HTML、CSS、JavaScript の仕組み

HTMLとは何ですか?

HTML は HyperText Markup Language の略です。一口に言ってしまうと思いますが、基本的に、私たちは HTML を使用して Web ページの構造や構成要素を定義します。

CSSとは何ですか?

CSS は Cascading Style Sheets の略です。 Web ページをスタイリングし、美しくするために使用します。

JavaScriptとは何ですか?

JavaScript は Web ページに機能を追加するために使用されます。たとえてみましょう。

建物を思い浮かべてください。

現実世界の建物は、インターネット上の Web ページのようなものです。スケルトンまたは構造、つまり建物のフレームと基礎 (HTML) があります。

きれいな壁、窓、タイルを追加して仕上げて見栄えを良くすることもできます (CSS)。

また、家、病院、スーパーマーケットなどの特定の機能を持たせることもできます (JavaScript)。

例えば、エレベーターのボタンを押すと、エレベーターが迎えに来てくれます。 JavaScript を使用すると、これが可能になります。

実際の例

これが実際の例です。 Twitter のような Web サイトを構築したいとします。プロフィールには、次のようなレイアウトが必要です:

まず、HTML を使用して、このレイアウトの構成要素を定義します。ここにあるこの構成要素は何ですか?

1. 画像
2. ユーザーの Twitter ハンドルを示すテキスト (@KarlgustaAnnoh など)。
3. メッセージを含む別のテキスト ブロック (ストーリーを通じてコーディングを教える...)。
4. プロフィール、場所、リンク、日付を編集するためのボタン/アイコン
5. フォロワー数。

これらの構成要素を Web ページに追加するには HTML を使用します。

次に、CSS を使用して視覚的な魅力を与えます。たとえば、CSS を使用すると、テキストを (名前のように) 太字にしたり、画像を丸くしたりできます。また、場所、リンク、日付のアイコンの色を変更し、それらの上にマウスを置いたときの外観を定義することもできます。

CSS とは視覚効果がすべてです。 CSSを使えば美しいアニメーションも作成できます。

現在、ほとんどの Web ページはインタラクティブです。クリックやスクロールなどのアクションに反応します。ここで JavaScript が登場します。JavaScript を使用すると、Web ページに機能や動作を追加できます。たとえば、ボタンをクリックして人をフォローできます。

つまり、JavaScript はプログラミング言語ですが、HTML (マークアップ言語) と CSS (スタイリング言語) は技術的にはプログラミング言語ではありません。これは、コンピュータに何をすべきかを指示するためにそれらを使用することはできないことを意味します。これらを使用して、Web ページの構成要素を定義し、スタイルを設定します。

あなたがインターネット上で見たすべての Web ページは、これら 3 つの言語で構築されています。したがって、これらとその機能を学び理解すればするほど、フロントエンド開発がより上手になります。

次回でお会いしましょう!

追伸これは私の新しいシリーズです。コーディングが初めてで、コーディングの学習に役立つ情報が必要な場合は、「2 時間の Web 開発者」をご覧ください。

以上がHTML、CSS、JavaScript の仕組みの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。