HTML チュートリアル: よく使われる HTML タグのコレクション (6)

HTML チュートリアル: よく使われる HTML タグのコレクション (6)

関連記事:初心者が学ぶ HTML タグ (5)
導入された HTML タグは、必ずしも XHTML 仕様に完全に準拠しているわけではありません。実際のレイアウトを作成するときには、いくつかの選択を行う必要があります。たとえば、B タグと FONT タグは XHTML 仕様に準拠していません。
1. 基本的なタグ要素
--------------------------------------------------------------------------
ファイル形式 <HTML></HTML> (HTML ファイルの始まりと終わり)
タイトル <TITLE></TITLE> (ヘッダーセクションに配置する必要があります)
ヘッダーセクション <HEAD></HEAD> (「件名」などのドキュメントの説明)
本文セクション <BODY></BODY> (コンテンツが配置されている場所)
2. 構造要素
--------------------------------------------------------------------------
タイトル <H?></H?> (H1、H2、H3、H4、H5、H6の6種類があります)
タイトルの配置 <H? ALIGN=LEFT|CENTER|RIGHT></H?>
セクション <DIV></DIV>
セクションの配置 <DIV ALIGN=LEFT|RIGHT|CENTER></DIV>
短い引用符 <Q> と </Q>
参照部分が長くない場合は、一部の参照ファイルでは可能です。次に、HTML3.0 の新しい構文であるこのタグの使用を検討できます。
引用セクション
<BLOCKQUOTE></BLOCKQUOTE> (通常は表示されるときにインデントされます) blockquote は、その領域の文書が文書内の人物または情報を引用していることを示すために使用されます。通常、引用文は<BLOCKQUOTE>を使用して引用され、
</BLOCKQUOTE> を使用してマークします。すると、ほとんどのブラウザはこれらの単語を読むときに別の方法で表現することになります。これは、他の誰かからの引用であることを読者に思い出させるためだけのものです。
強調 <EM></EM> (通常は斜体)
強い強調<STRONG></STRONG>(通常は太字)この文字はSTRONGで、
EM は話し方のトーンを強化するための単なる手段です。ほとんどのブラウザでは、<STRONG> と </STRONG> でマークされた単語を示すために太字フォントを使用します。
引用文 <CITE></CITE> (通常はイタリック体) <CITE> と </CITE> を使って、他の人が引用した単語をマークします。 プログラムソースコード <CODE></CODE> 読者がコンピュータについて書いている場合は、CODE を使用します。
このタグは、関連する単語をまとめてマークします。使用方法は、関連する単語を <CODE> と </CODE> でマークすることです。
プログラム出力サンプル<SAMP></SAMP>はHTMLでは変更されていません。HTMLを印刷する場合は
の構文。その場合、読者はこれらの文字を印刷するために特別な技術を使用する必要があるかもしれません。これらの文字以外では、読者はSAMPを使用できます
このシンボルがそれらを示します。このタグの特徴は、マークされたテキストが固定幅で表されることである。
キーボード入力 <KBD></KBD> KBDタグは通常、どの単語を入力できるかを読者に伝えるために使用されます。これらは次のようにマークされます。
KBD 文字は通常、固定幅の太字フォントで表されます。ただし、一部のブラウザでは固定幅文字のみが使用されます。
プログラム変数 <VAR></VAR> 変更される可能性のある単語については、HTMLでは
これは、簡単に変更できる変数または単語を表す VAR タグとともに表示されます。 <VAR>と
<VAR> を使用してマークします。これは、これらの変数が変更される可能性があることをユーザーに警告するために使用されます。
<DFN></DFN>を定義します(一部のブラウザではこの機能がありません)HTMLのリーダーの場合
そこに使われている言葉はいくつかの定義です。次に、読者は DFN ラベルの使用を検討できます。読者がMosaicブラウザを使用している場合。次に<DFN>と
</DFN> でマークされたテキストは斜体で表示されます。他のブラウザでは動作しない可能性があります。
著者アドレス <ADDRESS></ADDRESS>
大きなフォント <BIG></BIG>
小さいフォント <SMALL></SMALL>
言語 <LANG>
文書内で 2 つ以上の言語が使用されている場合は、<LANG> と </LANG> を使用してそれらをマークできます。これも HTML3.0 の新しい構文です。
著者 (AU)
<AU> と </AU> は一般的な AU ファイルを表すものではありません。このタグは読者の記事で使用されます。特定の著者が言及されている場合は、タグでマークすることができます。これもまた
HTML 3.0 は、著者向けに特別に設計されたタグです。
個人的
(PERSON) 多くのインデックス作成プログラムでは、プログラムが情報ページを表示することがあります。これらの情報ページを表示するときは、個人名が記載されている場合。次に、
これらの名前をマークするには、<PERSON> と </PERSON> を使用します。この構文も HTML 3.0 で追加された新しい構文です。
複数の単語から構成される単語(頭字語)
英語では、いくつかの単語は複数の単語で構成されています。このような単語に遭遇した場合は、<ACRONYM>と
</ACRONYM> タグは特殊な括弧で囲みます。これは HTML3.0 の新しい構文です。しかし、中国語を使う私たちにとって、そのような文法はあまり役に立ちません。
略語(ABBREV)ACRONYMと同様に、英語には多くの略語があります。HTML 3.0
これらの略語用に新しいタグも特別に作成されています。この新しいタグは <ABBREV> と呼ばれ、もちろん </ABBREV> と呼ばれる終了記号も付いています。
挿入(INS)HTMLファイルで既存のファイルに単語を挿入したい場合は、<INS>と
</INS> を使用してこれらの単語をマークします。これにより、読者は文書を確認するときに、文書が改訂されたかどうかを簡単に知ることができます。もちろん、この構文もHTML 3.0です
に新しい構文が追加されました。
削除 (DEL) の構文は、特定の単語または削除に関連する一部の部分が削除されることを読者に伝えるために使用されます。この新しいタグは HTML3.0 でも登場しました。
3. 表示モードに関連するタグ要素
--------------------------------------------------------------------------
大胆な
斜体<I></I>
下線を描画します <U></U> (一部のブラウザではこの機能がありません)
取り消し線 <STRIKE></STRIKE> (一部のブラウザではこの機能がありません)
行 <S></S> を削除します (一部のブラウザではこの機能がありません)
下付き文字 <SUB></SUB>
上付き文字 <SUP></SUP>
タイプライターフォント <TT></TT> (スペース文字が他のテキスト要素と同じ幅になるフォント)
プリセットフォーマットに従って<PRE></PRE>(文字間の相対位置を維持)
フォーマット済みの幅 <PRE WIDTH=?></PRE> (文字数)
中央 <CENTER></CENTER> (テキストとグラフィックは中央に配置されます)
フラッシュ<BLINK></BLINK>
フォント サイズ <FONT SIZE=?></FONT> (1 から 7)
フォントサイズを変更する <FONT SIZE=" |-?"></FONT>
基本フォント サイズ <BASEFONT SIZE=?> (デフォルト値は 3)
フォントの色 <FONT COLOR="#$$$$$$"></FONT>
フォントスタイルを指定してください <FONT FACE="***"></FONT>
複数の列 <MULTICOL COLS=?></MULTICOL>
列のテキストと端の間隔 <MULTICOL GUTTER=?></MULTICOL> (デフォルト値は 10 ピクセル)
列幅 <MULTICOL WIDTH=?></MULTICOL>
スペースを残してください <SPACER>
間隔タイプ <SPACER TYPE=horizo​​ntal| vertical|block>
間隔サイズ <SPACER SIZE=?>
間隔サイズ <SPACER WIDTH=? HEIGHT=?>
間隔<SPACER ALIGN=left|right|center>
4. ハイパーテキストリンクとグラフィック要素
--------------------------------------------------------------------------
特定の URL へのリンク <A HREF="URL"></A>
アンカーへのリンク <A HREF="URL#***"></A> (別のドキュメント内のアンカー)
<A HREF="#***"></A> (同じドキュメント内のアンカー)
指定されたフレームへのリンク <A HREF="URL"
ターゲット="***|_blank|_self|_parent|_top"></A>
「アンカーポイント」を設定 <A NAME="***"></A>
転送リンク <A REL="***"></A> (一部のブラウザではこの機能がありません)
逆リンク <A REV="***"></A> (一部のブラウザではこの機能がありません)
グラフィックを表示 <IMG SRC="URL">
グラフィックの位置 <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>
グラフィックの位置 <IMG SRC="URL" ALIGN=TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>
代替グラフィックテキスト <IMG SRC="URL" ALT="***"> (グラフィックを表示できない場合に表示するテキスト)
グラフィック <IMG SRC="URL" ISMAP> をクリックできます (.map ファイルで使用する必要があります)
クライアントはグラフィック<IMG SRC="URL" USEMAP="URL">をクリックできます。
マップ名をクリックします <MAP NAME="***"></MAP>
クリック可能な領域を指定します <AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF>
グラフィック サイズ <IMG SRC="URL" WIDTH=? HEIGHT=?> (ピクセル単位) は、グラフィック表示の幅と高さを表します。
境界線のサイズ <IMG SRC="URL" BORDER=?> (ピクセル単位) 図形の外側の境界線の幅。
<IMG SRC="URL" HSPACE=? VSPACE=?> の周囲の空白 (ピクセル単位)
vspace、hspace は、グラフィックスとテキストの垂直方向と水平方向の間隔を記述します。
低解像度のグラフィック <IMG SRC="URL" LOWSRC="URL"> クライアント側でスケジュールされた更新 <META
HTTP-EQUIV="更新" CONTENT="?; URL=URL">
プラグイン オブジェクト <EMBED SRC="URL"> (ドキュメントにプラグイン オブジェクトを追加する)
オブジェクトのサイズ <EMBED SRC="URL" WIDTH=? HEIGHT=?>
5. 段落をタグ要素に分割する
--------------------------------------------------------------------------
段落 <P></P> (終了タグ </p> は通常省略できます)
テキストの配置を指定します <P ALIGN=LEFT|CENTER|RIGHT></P>
強制改行<BR>
改行後の開始点を指定します <BR CLEAR=LEFT|RIGHT|ALL>
水平線 <HR>
水平線の位置 <HR ALIGN=LEFT|RIGHT|CENTER>
水平線の太さ(下方向)<HR SIZE=?>(ピクセル単位)
水平線の長さ(右) <HR WIDTH=?> (ピクセル単位)
水平線比率の幅 <HR WIDTH="%"> (ページ幅のパーセンテージ)
実線 <HR NOSHADE> (3D効果なし)
改行なし<NOBR></NOBR>
改行 <WBR> (必要に応じてここで改行できます)
6. リスト要素 <list>
--------------------------------------------------------------------------
順序なしリスト <UL><LI></UL>
ULコンパクト
ヘッダーシンボルタイプ <UL TYPE=DISC|CIRCLE|SQUARE> (すべての列挙項目)
<LI TYPE=DISC|CIRCLE|SQUARE> (この項目と次の項目)
順序付きリスト<OL><LI></OL>
コンパクト
数値型 <OL TYPE=A|a|I|i|1> (すべての列挙項目)
<LI TYPE=A|a|I|i|1> (この項目と次の項目)
開始番号 <OL START=?> (すべての列挙項目)
<LI VALUE=?> (この項目と次の項目)
定義リスト <DL><DT><DD></DL> (<DT>=定義項目、<DD>=定義内容)
DLコンパクト
メニュー形式の列挙 <MENU><LI></MENU> (<LI> は各列挙項目の前に配置されます)
シンプルにする <MENU COMPACT></MENU>
ディレクトリ リスト <DIR><LI></DIR> (<LI> は各リスト項目の前に配置されます)
<DIR COMPACT></DIR> を簡略化します。
7. 背景と色タグ要素
--------------------------------------------------------------------------
背景パターン <BODY BACKGROUND="URL">
背景色<BODY BGCOLOR="#$$$$$$">
テキストの色 <BODY TEXT="#$$$$$$">
接続されていないポイントの色<BODY LINK="#$$$$$$">
接続されたポイントの色<BODY VLINK="#$$$$$$">
正のリンク ポイントの色<BODY ALINK="#$$$$$$">
8. 特殊文字の置換(以下の置換マークは小文字にする必要があります)
--------------------------------------------------------------------------
特殊文字 &#?; (? は ISO 8859-1 コード)
< <
> >
& &
「」
登録されたTMですか?
著作権?
非改行スペース
9. 数式
--------------------------------------------------------------------------
例1:
<数学>
H(s)=∫<sub>0</sub><sup>∞
</sup>e<sup>st</sup>h(t)dt
</math>
例2:
<数学>
C<box>dV<sub>アウト</sub>
<over>dt</box>=I<sub>b</sub>
&tanh;(<box>κ(V<sub>in
</sub>-V<sub>出力</sub>)<over>2</box>
CdVoutdt=Ib &tanh;(κ(Vin-Vout)2
例3:
<数学>
(<array align="C"><item>
&ldet;<array align="cc">
<item>x<sub>11</sub>
<item>x<sub>12</sub>
<item>x<sub>21</sub>
<item>x<sub>22</sub>
<配列><rd>&rdet;
<item>y<item>z
</array>)</math> 、
これら 3 つの例から次のことがわかります。
「積分記号」を表すには &int を、下付き文字を表すには <sub> を、上付き文字を表すには <sup> を使用します。
<box> は、後続の項目がグループとして扱われることを示すために使用されます。<over> は除算記号を表します。 <array> は行列シンボルを処理し、<array
align=C|L|R> テーブル項目を中央、左、右に配置します。項目は、データの前に <item> を追加することで示されます。 &Ldet は行列式の左側を表し、&Rdet は行列式の右側を表します。
(キャリッジリターン ラインフィード) <br>
(スペース文字)
& (AND 記号) &
< (左山括弧、小なり記号) <
> (右山括弧、大なり記号) >
° (度) °
? (区切り文字) •
′´
「」
「「
” ”
‰ ‰
← ←
↑↑
→ →
↓ ↓
? ↔
√√
∝ ∝
∞ ∞
∠ ∠
∧ ∧
∨ ∨
∩ ∩
∪ ∪
? Ø
∫ ∫
∴ ∴
≈ ≈
¥(人民元) ¥
≠ ≠
≡ ≡
≤ ≤
≥ ≥
⊕ ⊕
λλ
μ μ
νν
ξ ξ
νν
ξ ξ
∏ ∏
∑ ∑
¥ ¥
… …
1 (電源記号) ¹
2 (四角い記号) ²
3 (立方体記号) ³
(上付き文字の場合)n<sup>r</sup>
(下付き文字の場合)C<sub>i</sub>
太字<b>太字</b>
斜体<i>斜体</i>
下線 <u>下線</u>
± (プラスとマイナスの記号) ±
× (掛け算記号) ×
÷(除算記号)÷
? (著作権) ©
?(登録商標)®
? (商標記号) ™
— (ダッシュ) —

<<:  CSS の複数行テキストがオーバーフローする場合の省略記号の例

>>:  SSHを使用してDockerサーバーに接続する方法

推薦する

WMLタグの概要

構造関連タグ--------------------------------------------...

CSSに基づいてマウス入力の方向を決定する

以前、フロントエンド技術グループに所属していたとき、グループのメンバーが面接中に問題に遭遇したと言っ...

CSS スタイルのリセットとクリア (異なるブラウザで同じ効果を表示するため)

異なるブラウザ間でページの表示を一致させるためには、フロントエンド開発において CSS スタイルのク...

HTML シンプルな Web フォーム作成例の紹介

<input> はユーザー情報を収集するために使用され、終了ステートメントはありません。...

フロントエンドでよく使われるjs関数メソッド

目次1. メール2. 携帯電話番号3. 電話番号4. URLアドレスですか? 5. 文字列ですか? ...

Mac M1 での Nginx のマルチサイト構成の実装

注: nginxはbrew経由でインストールされますウェブサイトのルートディレクトリ: /opt/h...

Firefox の CSS を使用してデータを盗む

0x00 はじめに数か月前、Firefox に脆弱性 (CVE-2019-17016) があること...

ウェブページの最も基本的なコード

◆お気に入りに追加例示するクリックすると、ブラウザのお気に入りメニューにウェブサイトが追加されます...

JavaScript配列をツリー構造に変換する方法

1. 需要バックエンドは、フロントエンドがツリー構造(重複データなし)に変換するためのデータを提供し...

vue3 統合 API における vue2 の $refs の代替方法についての簡単な説明

vue2 プロジェクト開発の経験があれば、$refs に精通しているでしょう。 vue3 の急激なア...

Vue の新しいパートナー TypeScript クイックスタート実践記録

目次1. 公式の足場を使って構築する2. プロジェクトディレクトリ分析3. TypeScript の...

Nginx のタイムドログカットの詳細な説明

序文デフォルトでは、Nginx ログはファイルに書き込まれます。各ドメインのログを区別するために、通...

Mysqlデータテーブルでワームレプリケーションを使用する方法

簡単に言えば、MySQL ワーム レプリケーションは、クエリされたデータを指定されたデータ テーブル...

デザイン協会: なぜ間違った場所を探したのですか?

数日前、バスで仕事に行きました。バスのカードリーダーの実際の使用シーンを実際に見て、カードリーダーの...

Node.jsを理解するのはとても簡単です

目次Node.js の公式紹介Node.jsのコア開発言語ウェブ上の JavaScript と No...