ホームページ  >  記事  >  ウェブフロントエンド  >  HTML 入門 — 1 日ですぐにマスター

HTML 入門 — 1 日ですぐにマスター

黄舟
黄舟オリジナル
2016-12-22 14:49:171347ブラウズ

補足

HTML について何も知らず、HTML をどのように始めればよいかまだ心配している場合は、この記事を読むことを強くお勧めします。これは、HTML をすぐにマスターするのに役立ちます。すでに HTML をマスターしている場合は、この記事を読むことを強くお勧めします。また、より良いアドバイスをいただければ幸いです。


概要

HTMLは、一般的にHyperText Markup Languageとして知られており、Hyper TextMarkup Languageの略称であり、Webページのドキュメントを記述するために使用されるマークアップ言語です。 Web ページのファイル自体は単なるテキスト ファイルですが、テキスト ファイルにマーク記号を追加することで、コンテンツの表示方法 (テキストの処理方法、画像の配置方法、画像の表示方法など) をブラウザーに伝えることができます。 ) これらのマーク シンボルは HTML であり、これらのマーク シンボルを学習することで HTML を学びます。今日は主に、HTML 要素とも呼ばれるいくつかの一般的な HTML マーク シンボルを学びます。または包含のタグ定義のペア。ラベルは 2 つの文字列「」で構成され、開始タグ「」と終了タグ「>」が含まれます。

html タグ要素には 4 つの形式があります:

空の要素:

属性を持つ空の要素:

コンテンツを持つ要素:

コンテンツと属性を含む要素:これがコンテンツです

ここで言っておきたいのは、HTML ドキュメントでは、タグ名と属性名はサイズに依存しないということです。

HTML フレームワークの必要な基本要素です

はドキュメントの始まりと終わりを表します

はドキュメントの始まりと終わりを表しますhead

)、感嘆符 (!)、小なり記号と感嘆符の間にスペースはありません。続いて 2 つのダッシュ (--)、次にコメントの内容、最後に 2 つのダッシュ (-) -) と大なり記号 (>)。 <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal>例: <!--これはコメントの内容です--></p> <p> </p> <p>段落制御に関連するタグ</p> <p><palign></palign></p> <p>段落を作成すると、属性 align は次のことを示します段落の配置方法。# は、左揃え、中央揃え、右揃え、両端揃えにすることができます。 </p> <p><br></p> <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal>関数は改行です</p> <p><hrcolor></hrcolor></p> <p>関数は水平線を挿入することであり、属性colorは色を表すために使用されます。 </p> <p> </p> <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal>テキスト表示に関するタグ </p> <p></p> <center>…</center> <p> テキストを中央揃えにする </p> <p><hnalign></hnalign></p> <p> を表す機能です。 document タイトル、n は 1 ~ 6 の整数、once は最大のタイトル、6 は最小のタイトル、align は左、中央、右を含むタイトルの配置を設定します</p> <p><fontsize color="# ">. ..</fontsize></p> <p>フォントを設定します。サイズはフォントのサイズで、1から7の整数で、数値が大きいほどフォントが大きくなります。 </p> <p><b>...</b></p> <p>テキストを太字にします。 </p> <p><i>…</i></p> <p>テキストを斜体にする</p> <p> </p> <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal>リスト要素によって作成されるタグ</p> <p>a. 番号付きリストを作成します: </p> <p></p> <ol>... ol>を使用します。 start 属性で開始シーケンス番号を設定します。 <p></p> <li>...</li>value 属性を使用して、リスト内の数値の順序を変更します。 <p> </p> <p>b. </p> <p></p> </ol> <ul> と <li> に一致するリストを作成します。 <p> ディスク、実線の円で表示されます。正方形、塗りつぶされていない正方形を表示します。不十分な円を表示する </p> <p> B. 署名されていないリストを作成する </p> <p> & lt; </p> <p> </p> <p> テーブル要素のラベル </p> <p> Web ページのレイアウトにおけるテーブルの役割は重要です。テーブルは </p> <table> で定義され、<p> は具体的には次のように定義されます: <tableborder align="#" bgcolor=" rgb"></tableborder></p> <p>border 属性はテーブルの境界線の幅を定義するために使用され、align 属性はテーブルの配置 (左、右、または中央) を設定するために使用されます。 bgcolor は色です。 </p> <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal> </p> <p></p> <caption></caption>テーブルのタイトルを定義するために使用されます <p></p> <tr>...</tr>テーブルに新しい行を追加します <p></p> <th>... </th>> ;ヘッダーの定義に使用されます<p></p> <td>…</td>gt;セルの定義に使用されます<p> </p> <p>html インタラクティブフォーム</p> <p>フォームは主に、通常の Web ページのデータ収集機能を担当します。登録情報、入力 Web ページ上で操作できるすべての情報はフォームです。 </p> <p>フォームは </p> <form>...</form> 要素の間に他の関連要素やコントロールを埋め込むことで、HTML ドキュメントの一部としてフォームを作成できます。 <p>フォームを作成するための基本的な構文は次のとおりです: </p> <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal><formmethod or post action="URL">….</formmethod></p> <p>属性メソッドは、使用されるメソッドを指定するために使用されます。フォーム データをサーバーに送信する場合、HTTP メソッドは get または post のいずれかになります。送信されたデータは URL の末尾に追加され、URL の一部としてサーバーに送信されます。 </p> <p>以下はフォームに関してよく使用される要素です: </p> <p></p> <p></p> <input> 要素は、属性を持つ空の要素です。 <p></p> <inputtype name="name" size="size" value="value'><p></p><p><br/></p> 属性タイプは、作成されるコントロールのタイプを指定するために使用され、属性はsize はコントロールの名前を指定するために使用され、属性値はコントロールの初期値を指定します。<p></p><p></p><p> type については、を参照してください。次の図: <br/></p><p></p>リスト ボックス要素<p><br/>では、リスト ボックスは <select> オプションによって作成されます。リスト ボックスの <option> 要素は、</p><p></p><p><img src=" https: title="1482389300462397.png" alt="HTML 入門 — 1 日ですぐにマスター"></inputtype>複数行のテキスト入力コントロール<p><textareaname rows="number of rows" cols="number ofcolumns"> によって提供されます。 …</textareaname></p> <p>属性 rows は、テキスト ボックス入力コントロールのビジュアル領域に表示されるテキスト行数を指定するために使用され、cols はテキスト入力コントロールのビジュアル領域の表示幅を指定します。 </p> <p><br>ハイパーリンクタグ</p> <p><ahref></ahref></p> <p>href属性は、リンク先のアドレスを先頭に配置するために使用されます。 <a></a> タグ間のテキストは、ブラウザー </p> <p></p> に表示されるリンク テキストとして使用されます。<p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal>埋め込み画像タグ</p> <p><img src="URL" style="max-width:90%" height="m" alt="HTML 入門 — 1 日ですぐにマスター" >属性 src は画像リソースの場所を指定し、属性 width と height は画像のサイズを指定するために使用されます。ここで、src は絶対パスではなく、可能な限り相対パスを使用する必要があることに注意してください。 </p> <p> </p> <p> </p> <p style="margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; word-wrap: break-word; word-break: break-all; color: rgb(68, 68, 68); font-family: " microsoft yahei simsun narrow white-space: normal>特殊文字要素 </p> <p>特殊文字には、文字参照と実体参照が含まれます。以下に、一般的に使用されるものをまとめます</p> <p><img src="https://img.php.cn//upload/image/973/669/467/1482389320383355.png" title="1482389320383355.png" alt="HTML 入門 — 1 日ですぐにマスター"></p> <p style="margin: 0px auto; padding: 0px; font-size: 18pt; word-wrap: break-word; word-break: break-all; width: 626px; height: auto; border-bottom: 1px dashed rgb(221, 221, 221); font-family: 黑体; color: rgb(68, 68, 68); white-space: normal;">概要</p> <p>最も一般的に使用される最も基本的なタグ要素のいくつかをまとめます。要約すると、これらの基本をマスターすれば、簡単な HTML Web ページを書くことは問題なく、すぐにジュニア HTML になれるということです。これは、将来のさらなる学習の基礎にもなります。 - 1 日ですぐにマスター 関連コンテンツの詳細については、PHP 中国語 Web サイト (www.php.cn) に注目してください。 </p> <p><br></p> <p></p> </table> </li> </ul>
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。