HTMLの基礎 HTMLの構造

HTMLの基礎 HTMLの構造
HTML ファイルとは何ですか?
HTML は Hyper Text Markup Language の略です。
HTML ファイルは、マークアップを含むテキスト ファイルです。
これらのタグはブラウザがページを表示する方法を制御します。
HTML ファイルには、htm または html 拡張子が必要です。
HTML ファイルは、簡単なテキスト エディターで作成できます。


まず、HTML 言語について簡単に紹介します (ここで強調したいのは、実際に操作できるということです)。HTML はインターネットの共通言語であり、シンプルで汎用性の高いフル機能のマークアップ言語です。これにより、Web ページ作成者はテキストと画像を組み合わせた複雑なページを作成できるようになり、これらのページは、使用されているコンピューターやブラウザーの種類に関係なく、インターネット上の他のユーザーが閲覧できるようになります。すごいと思いませんか? いいえ、今見ているのはこの言語で書かれたページです。

はい、HTML は、あまりよく知らないからといって、それほど魔法的なものではありません。では、その秘密を解き明かしていきましょう。まず、HTML の構成構造を紹介します。

HTML の構造 (頭、目、体 -- まさに人間のようですね)

1. 頭。英語を学んだことがあるなら、英語で「头」の書き方も知っているはずです。はい、HEAD です。したがって、head の HTML 記述は <head>head content</head> です。簡単ですよね? これら 2 つは、後者には前者よりも余分な「/」記号があることを除けば、非常によく似ていることに注意してください。今後頻繁に使用される予定です。

2. 目。人間の目と同じように、ウェブページは心の窓であり、ウェブページの目はタイトルであるべきです。タイトルはどのように説明すればよいでしょうか?タイトル、はい!ご存知のとおり、目は頭にあります。したがって、<title>タイトル</title> は <head> と </head> の間に配置する必要があります。つまり
<head><title>タイトル</title></head>

3. ボディ。本文はウェブページの最も重要な部分です。なぜなら、前に話した内容はページに表示される内容ではなく、実際に目にするのはページの本文(もちろん、そのタイトルはブラウザの左上隅に表示されます)であり、本文は----BODYであり、その記述方法は<body>ページ コンテンツ</body>です。
最後に、これらの部分を 1 つの Web ページにまとめることを忘れないでください。そのためには、<html></html> で囲みます。
さて、Web ページの構造を全体的に見てみましょう。

コードをコピー
コードは次のとおりです。

<html>
<ヘッド>
<タイトル>
タイトル
</タイトル>
</head>
<本文>
ページの内容
</本文>
</html>

試してみませんか?
Windows を実行している場合は、メモ帳を開いて次のテキストを入力します。

ヒント: 実行前にコードの一部を変更することができます

このファイルを「mypage.htm」として保存します。
ファイルを直接ダブルクリックするか、ブラウザを起動します -> ファイル メニューで「開く」(または「ページを開く」) を選択すると、ダイアログ ボックスが表示されます -> 「参照」(または「ファイルの選択」) を選択し、作成した HTML ファイル「mypage.htm」を見つけて選択し、「開く」をクリックします ->。 すると、ダイアログ ボックスにこのファイルのアドレスが表示されます (例: 「C:\MyDocuments\mypage.htm」) -> 「OK」をクリックすると、ブラウザにこのページが表示されます。


HTML エディターについて:
frontpage、dreamwaver などの一部の WYSIWYG エディターを使用すると、プレーンテキストでコードを記述せずに簡単にページを作成できます。
しかし、熟練した Web 開発者になりたい場合は、プレーン テキスト エディターでコードを記述することを強くお勧めします。これにより、HTML の基礎を習得するのに役立ちます。

FAQ Q: HTML ファイルを作成しましたが、ブラウザで結果が表示されません。なぜでしょうか?
A: ファイルを保存し、正しいファイル名と拡張子 (例: 「c:\mypage.htm」) を使用していることを確認してください。また、ブラウザで開くときに同じファイル名を使用していることを確認してください。
Q: HTML ファイルを編集しましたが、変更内容がブラウザに表示されません。なぜでしょうか?
A: ブラウザはページをキャッシュするので、同じページを 2 回読み取る必要がありません。このページが変更されましたが、ブラウザはそれを認識しません。編集したページをブラウザに強制的に読み込ませるには、「更新/再読み込み」ボタンを使用してください。

<<:  VMWare仮想マシンにCentOS7システムをインストールする詳細な手順

>>:  MySQLがフルテーブルスキャンを実行するいくつかの状況

推薦する

jsは多次元配列を1次元配列に変換し、それを並べ替えます

目次まず多次元配列の平坦化についてお話しましょう方法 1: flat()方法 2: 空の文字列を連結...

JavaScript のドキュメント オブジェクト モデル (DOM)

目次1. DOMとは何か2. 要素を選択する3. getElementById() 4. クエリセレ...

フレックスレイアウトのスペース間の最後の行の左揃えの問題を解決する方法

まずはコードと効果を見てみましょう↓ <スタイル> 。主要 { アウトライン: 1px ...

「さらに表示」ボタンによる複数行テキストの切り捨てに関する考察

最近、たまたまこの小さな要件に遭遇しました。昔、JS を使用してこれを処理したことを覚えていますが、...

Docker-Composeコマンドの使い方の詳しい説明

Docker コンテナはさまざまな方法で管理およびデプロイできます。 Docker コマンドを直接使...

VMware Workstation のダウンロードとインストールの詳細なチュートリアル

仮想マシンは非常に便利なテストソフトウェアです。ハードウェアに損傷を与えることなく、さまざまなテスト...

Windows Server 2012 でファイル サーバーを構築するための詳細な手順

ファイル サーバーは、企業内で最も一般的に使用されるサーバーの一つであり、主にファイル共有を提供する...

Nodejs モジュール システムのソースコード分析

目次概要CommonJS 仕様Node の CommonJS 仕様の実装モジュールのエクスポートとイ...

mysql 5.7.11 winx64 初期パスワード変更

公式サイトからMySQL-5.7.11-winx64の圧縮版をダウンロード。インストール後、パスワー...

Docker用国産イメージウェアハウスの使い方

1. 問題の説明何らかの理由により、中国でのDockerイメージのダウンロード速度は特に遅くなります...

AES_ENCRYPT() と AES_DECRYPT() を使用して MySQL を暗号化および復号化する正しい方法の例

序文最近、仕事でAES_ENCRYPT()関数を使用してプレーンテキストを暗号化し、MySQL に保...

CSS でハニカム/六角形アトラスを実装するためのサンプルコード

理由は分かりませんが、UIではハニカム効果(手を広げたような効果)のデザインが好まれます。 1. 六...

JavaScriptの強力な演算子をいくつか見てみましょう

目次序文1. ヌル合体演算子2. ??= 空代入演算子3. ?. オプション連鎖演算子4. ?: 三...

MySQLからOracleへのリアルタイム同期ソリューションの詳細な説明

1 要件の概要MySQL5.6本番データベースの複数のテーブルのデータは、Oracle11gデータウ...