記事ディレクトリ

html紹介
HTML構文仕様
HTMLフレーム
いくつかのラベルの意味とその使用方法

html紹介

html言語は、私たちがWebページを作成するために使用する言語です。非常に単純です。正確には、htmlはプログラミング言語ではなく、マークアップ言語です。次のことは、htmlを学ぶことから得たいくつかの利点とメモです。
定義：HTMLはハイパーテキストマークアップ言語（ハイパーテキストマークアップ言語）を指します
マークアップ言語はマークアップタグのセットです
いわゆるハイパーテキストには2つの意味があります。1。画像、音声、アニメーション、マルチメディア、その他のコンテンツ（テキストの制限を超える）を勇気を持って追加します。2。ハイパーリンクテキストしたがって、Webページは実際にはhtmlファイルです。
ご存知のとおり、ウェブページを開くにはブラウザが必要ですが、Google ChromeのカーネルがBlinkであるように、異なるブラウザのカーネルは異なります（異なるカーネルは同じコードを異なる方法で解釈します）。ほとんどのブラウザはBlinkまたはWebkitを使用しています。ただし、どのブラウザが共通の標準に従うかは関係なく、この標準はWeb標準です。Web標準については多かれ少なかれ聞いたことがあるはずです。Web標準は、W3C（World Wide Web Consortium）組織およびその他の標準化組織によって策定された一連の標準です。標準のコレクション。
Web標準の構成には、主に構造（Structure）、パフォーマンス（Presentation）、および動作（Behavior）が含まれます。構造：構造は、Webページの要素を並べ替えて分類するために使用されます。この段階では、主にHTMLを学習します。パフォーマンス：パフォーマンスは、サービス、色、サイズなどのWebページ要素の外観スタイルを設定するために使用されます。これは主にCSSを指します。動作：動作とは、Webページモデルの定義とインタラクションのコンパイルを指します。この段階では、主な学習はJavascriptです。

HTML構文仕様

HTMLタグは、たとえば山かっこで囲まれたキーワードです。

<html>

ラベルはダブルラベルとシングルラベルに分けられます（ほとんどのラベルはダブルラベルであり、いくつかのラベルだけがシングルラベルであるため、いくつかのシングルラベルを覚えておくだけで、残りはダブルラベルです）
タグ間の関係は、封じ込め関係と並列関係に分けられます

HTMLフレーム

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

！DOCTYPEは宣言であり、ドキュメントの先頭に配置する必要があります。正確には、これはhtmlタグではなく、ドキュメントタイプ宣言タグです。
html lang = "en"は、これが英語のWebページであることを意味します
html lang = "zh-CN"は、これが中国のWebページであることを意味します
Webページの文字化けを防ぐために使用されます。UTF-8はユニバーサルコードと呼ばれます。通常、テキストの保存にはUTF-8を使用します。

いくつかのラベルの意味とその使用方法

タイトルタグ

<h1> </h1>
<h2> </h2>
<h3> </h3>
<h4> </h4>
<h5> </h5>
<h6> </h6>

機能：タイトルタグ付きのテキストが太字になり、フォントが大きくなり、タイトルが1行になり、h1からh6に進むにつれて、タイトルのフォントが徐々に小さくなります。

段落と改行タグ

パラグラフタグ：

<p>

ニューラインラベル

<br/>

ニューラインラベルが単一のラベルである場合

テキストフォーマットタグ

<strong>  <em>  <del>  <ins>

これらのタグは、太字のタグ、傾斜したタグ、ストライクスルータグ、下線付きのタグです。これらのタグは紹介するものがなく、名前が示すように機能します。

ボックスラベル

<div>
<span>

これらの2つのタグには、コンテンツとレイアウトを保持するために使用されるボックスのようなセマンティクスがないため、ボックスタグと呼びます。これら2つのタグには違いがあります。divは大きなボックスで、スパンは小さなボックスです。 1行に配置できるdivタグは1つだけですが、複数のspanタグを配置できます。

画像ラベルとパスラベル

<img>

これは単一のタグであり、imgタグには多くの属性があります

属性	属性値	効果
src	ピクチャーパス
alt	テキスト	テキストを置き換え、画像を表示できない場合はテキストを使用します
題名	テキスト	プロンプトテキスト、画像をマウスで表示してテキストを表示
幅/高さ/境界線	px	画像の幅/高さ/境界線の厚さを順不同で設定します

画像のパスは、相対パスと絶対パスに分けられます

相対パスは3つの形式に分けられます

画像アドレスがhtmlファイルの上位レベルにある場合

<img src = "文件名.格式" />

画像アドレスがhtmlファイルと同じレベルの場合

<img src = "文件夹名 / 文件名.格式" />

画像アドレスがhtmlファイルの次のレベルにある場合

<img src = "../ 文件名.格式" />

絶対パス：

<img src = "绝对位置 \ 文件名.格式 / "

ハイパーリンクラベル

リンクの構文形式

<a href = "跳转目标" target = "目标窗口的弹出方式">文本或图像</a>

hrefは、リンクターゲットのURLアドレスを指定するために使用されます。
ターゲットは、リンクされたページの開く方法を指定するために使用されます。その属性値は、selfとblankの2つのタイプに分けられます。ここで、selfはデフォルト値です。つまり、このページはリンクされたページに置き換えられ、空白はリンク先のページが新しいウィンドウで開きます。

リンク分類
1. 外部リンク、href = "http：// URL"
2. 内部リンク、href = "filename.html"。
3. ヌル接続、href = "＃"
4. ダウンロードリンク、hrefのアドレスがファイルまたは圧縮パッケージの場合、このファイルがダウンロードされます
5. Webページ要素リンク
6. アンカーリンク：ページの場所をすばやく見つけることができます（この記事のコンテンツに相当します）アンカーhref = "tag"ターゲットid = "tag"アンカーリンクは、ターゲットの場所にid属性、セカンダリid属性を追加する必要があります値は、アンカーリンクのhref値と一致している必要があります。
コメント

フォーマット：

ショートカットキー：Ctrl + /

特別なキャラクター

htmlファイルでは出力できない文字がありますが、現時点では特殊な表現方法で出力する必要があります
```
空格       &nbsp
<          &lt
>          &gt
```
フォームラベル
フォーマット
```
<table><tr><td>...</td></tr></table>
<th></th>
```
テーブルはテーブルラベルであり、行ラベルとセルラベルはテーブルラベルに配置する必要があります。trは行ラベル、tdは各行の中央にあるセルラベル、thはヘッダーセルです。
テーブル属性

属性	効果	属性値
整列	テキストは中央揃え、左揃え、右揃え	中央/左/右
境界	セルに境界線があるかどうかを指定します	px
セルパディング	表のテキストと境界線の間の距離	px
セルペーシング	セル間距離	px
幅高さ	テーブルの長さと幅	px

テーブル構造ラベル
```
<thead>和<tbody>
```
セルを結合します
行間でセルをマージ：
rowspan =マージされたセルの
数列間でセルをマージ：colspan =マージされたセルの
数

リストラベル

1.順不同リスト
```
<ul>
<li>...</li>
...
</ul>
```
2.注文リスト
```
<ol>
<li>...</li>
...
</ol>
```
3.カスタムリスト
```
<dl>
<dt>...</dt>
<dd>...</dd>
...
</dl>
```
フォームラベル

フォームには、フォームフィールド、フォームコントロール、プロンプト情報の3つの部分があります。
- フォームフィールド：
```
<form action = "url地址"  method = ”提交方式“  name = "表单域名称"></form>
```
フォームコントロール：
1. 入力（シングルラベル）
属性タイプ名前値チェック済み maxlength
タイプ属性の属性値

属性	タイプ	名前	値	チェック済み	maxlength

タイプ属性の属性値	ボタン	チェックボックス	ファイル	隠された	画像	パスワード	無線	リセット	参加する	テキスト

マークラベル
<label>

ラベルのforの属性値は、入力のidの属性値と一致している必要があります
ドロップダウンフォーム

<select>   <option>选项</option>
                           ......
                           <option  selected = "selected">
                           (默认为选中状态)
                           </select>

テキストフィールド
```
<textarea>
```
テキストフィールドは、複数行のテキスト入力ボックスを作成できます。

最後に、htmlを学んでいたときに書いたメモです。主にhtmlのさまざまなタグの役割を記録しました。結局のところ、htmlはマークアップ言語です。タグの使い方を学んだ後は、htmlが役に立ちます。

上記は、htmlでより一般的に使用されるタグの一部ですが、すべてのタグではありません。日常の使用の過程で、タグの使用方法や形式を忘れたり、あまり使用されない人気のないタグを使用したりすることがよくあります。ここでは、すべての人にWebサイトW3Cをお勧めします（これは直接クリックできます）。はい）、このウェブサイトでは、いくつかのhtmlとcssのすべてのタグをクエリできます。これは非常に使いやすいです。この元の記事がお役に立てば幸いです。皆さんがより強くなることを願っています。

HTML学習の概要