HTML-基本タグ

見出しタグ

すべてのドキュメントは見出しで始まります。見出しにはさまざまなサイズを使用できます。HTMLには、要素を使用する6つのレベルの見出しもあります<h1>, <h2>, <h3>, <h4>, <h5>, そして <h6>。見出しを表示している間、ブラウザはその見出しの前に1行、後に1行追加します。

<!DOCTYPE html>
<html>

   <head>
      <title>Heading Example</title>
   </head>
	
   <body>
      <h1>This is heading 1</h1>
      <h2>This is heading 2</h2>
      <h3>This is heading 3</h3>
      <h4>This is heading 4</h4>
      <h5>This is heading 5</h5>
      <h6>This is heading 6</h6>
   </body>
	
</html>

これにより、次の結果が生成されます-

段落タグ

ザ・ <p>タグは、テキストをさまざまな段落に構造化する方法を提供します。以下の例に示すように、テキストの各段落は、開始<p>タグと終了</ p>タグの間に配置する必要があります。

<!DOCTYPE html>
<html>

   <head>
      <title>Paragraph Example</title>
   </head>
	
   <body>
      <p>Here is a first paragraph of text.</p>
      <p>Here is a second paragraph of text.</p>
      <p>Here is a third paragraph of text.</p>
   </body>
	
</html>

これにより、次の結果が生成されます-

改行タグ

あなたが使用するときはいつでも <br />要素、それに続くものはすべて次の行から始まります。このタグはの例ですempty 要素。タグの間に何も入れないため、開始タグと終了タグは必要ありません。

<br/>タグには文字間にスペースがあります brスラッシュ。このスペースを省略すると、古いブラウザでは改行のレンダリングに問題が発生しますが、スラッシュ文字を見逃して<br>を使用すると、XHTMLでは無効になります。

<!DOCTYPE html>
<html>

   <head>
      <title>Line Break  Example</title>
   </head>
	
   <body>
      <p>Hello<br />
         You delivered your assignment ontime.<br />
         Thanks<br />
         Mahnaz</p>
   </body>
	
</html>

これにより、次の結果が生成されます-

コンテンツのセンタリング

使用できます <center> ページの中央またはテーブルセルにコンテンツを配置するためのタグ。

<!DOCTYPE html>
<html>

   <head>
      <title>Centring Content Example</title>
   </head>
	
   <body>
      <p>This text is not in the center.</p>
      
      <center>
         <p>This text is in the center.</p>
      </center>
   </body>
	
</html>

これにより、次の結果が生成されます-

水平線

水平線は、ドキュメントのセクションを視覚的に分割するために使用されます。ザ・<hr> タグは、ドキュメントの現在の位置から右マージンまで線を作成し、それに応じて線を区切ります。

たとえば、以下の例のように、2つの段落の間に線を引くことができます-

<!DOCTYPE html>
<html>

   <head>
      <title>Horizontal Line Example</title>
   </head>
	
   <body>
      <p>This is paragraph one and should be on top</p>
      <hr />
      <p>This is paragraph two and should be at bottom</p>
   </body>
	
</html>

これにより、次の結果が生成されます-

再び <hr /> タグはの例です empty 要素。タグの間に何も入れないため、開始タグと終了タグは必要ありません。

ザ・ <hr /> 要素の文字間にスペースがあります hrスラッシュ。このスペースを省略すると、古いブラウザでは水平線のレンダリングに問題が発生しますが、スラッシュ文字を見逃して使用する場合は<hr> XHTMLでは無効です

フォーマットを保持する

場合によっては、テキストをHTMLドキュメントでの記述方法の正確な形式に従わせたいことがあります。このような場合、事前にフォーマットされたタグを使用できます<pre>

冒頭の間にあるテキスト <pre> タグとクロージング </pre> タグは、ソースドキュメントのフォーマットを保持します。

<!DOCTYPE html>
<html>

   <head>
      <title>Preserve Formatting Example</title>
   </head>
	
   <body>
      <pre>
         function testFunction( strText ){
            alert (strText)
         }
      </pre>
   </body>
	
</html>

これにより、次の結果が生成されます-

内部に保持せずに同じコードを使用してみてください <pre>...</pre> タグ

ノーブレークスペース

「12人の怒っている男性」というフレーズを使用するとします。ここでは、ブラウザで「12、Angry」と「Men」を2行に分割する必要はありません。

An example of this technique appears in the movie "12 Angry Men."

クライアントブラウザでテキストを分割したくない場合は、改行しないスペースエンティティを使用する必要があります &nbsp;通常のスペースの代わりに。たとえば、段落で「12人の怒れる男」をコーディングする場合は、次のコードのようなものを使用する必要があります。

<!DOCTYPE html>
<html>

   <head>
      <title>Nonbreaking Spaces Example</title>
   </head>
	
   <body>
      <p>An example of this technique appears in the movie "12&nbsp;Angry&nbsp;Men."</p>
   </body>
	
</html>

これにより、次の結果が生成されます-