HTML-属性

HTMLタグと、見出しタグのような使用法はほとんど見られませんでした。 <h1>, <h2>, 段落タグ <p>およびその他のタグ。これまでは最も単純な形式で使用していましたが、ほとんどのHTMLタグには、追加の情報である属性を含めることもできます。

属性は、HTML要素の特性を定義するために使用され、要素の開始タグ内に配置されます。すべての属性は2つの部分で構成されています-aname と value

ザ・ name設定するプロパティです。たとえば、段落<p> この例の要素には、名前が align、ページ上の段落の配置を示すために使用できます。
ザ・ valueプロパティの値を設定し、常に引用符で囲む必要があるものです。以下の例は、align属性の3つの可能な値を示しています。 left, center そして right。

属性名と属性値では大文字と小文字は区別されません。ただし、World Wide Web Consortium（W3C）は、HTML4の推奨事項で小文字の属性/属性値を推奨しています。

例

<!DOCTYPE html> 
<html>
 
   <head> 
      <title>Align Attribute  Example</title> 
   </head>
	
   <body> 
      <p align = "left">This is left aligned</p> 
      <p align = "center">This is center aligned</p> 
      <p align = "right">This is right aligned</p> 
   </body>
	
</html>

これにより、次の結果が表示されます-

コア属性

大部分のHTML要素（すべてではありませんが）で使用できる4つのコア属性は次のとおりです。

Id
Title
Class
Style

Id属性

ザ・ idHTMLタグの属性を使用して、HTMLページ内の任意の要素を一意に識別できます。要素にid属性を使用する主な理由は2つあります-

要素が一意の識別子としてid属性を持っている場合、その要素とそのコンテンツだけを識別することができます。
Webページ（またはスタイルシート）内に同じ名前の要素が2つある場合は、id属性を使用して、同じ名前の要素を区別できます。

別のチュートリアルでスタイルシートについて説明します。ここでは、以下に示すように、id属性を使用して2つの段落要素を区別しましょう。

Example

<p id = "html">This para explains what is HTML</p>
<p id = "css">This para explains what is Cascading Style Sheet</p>

タイトル属性

ザ・ title属性は、要素の推奨タイトルを示します。それらの構文はtitle 属性は説明されているものと似ています id 属性-

この属性の動作は、属性を保持する要素によって異なりますが、カーソルが要素の上にあるとき、または要素の読み込み中にツールチップとして表示されることがよくあります。

Example

<!DOCTYPE html>
<html>

   <head>
      <title>The title Attribute Example</title>
   </head>
	
   <body>
      <h3 title = "Hello HTML!">Titled Heading Tag Example</h3>
   </body>
	
</html>

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

次に、「タイトル付き見出しタグの例」にカーソルを合わせてみてください。コードで使用したタイトルがカーソルのツールチップとして表示されていることがわかります。

クラス属性

ザ・ class属性は、要素をスタイルシートに関連付けるために使用され、要素のクラスを指定します。カスケードスタイルシート（CSS）を学習するときに、クラス属性の使用について詳しく学習します。だから今のところあなたはそれを避けることができます。

属性の値は、スペースで区切られたクラス名のリストの場合もあります。例-

class = "className1 className2 className3"

スタイル属性

style属性を使用すると、要素内でカスケードスタイルシート（CSS）ルールを指定できます。

<!DOCTYPE html>
<html>

   <head>
      <title>The style Attribute</title>
   </head>
	
   <body>
      <p style = "font-family:arial; color:#FF0000;">Some text...</p>
   </body>
	
</html>

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

現時点ではCSSを学習していないので、CSSについてあまり気にせずに進めましょう。ここでは、HTML属性とは何か、およびコンテンツのフォーマット中にそれらをどのように使用できるかを理解する必要があります。

国際化属性

3つの国際化属性があり、ほとんどの（すべてではありませんが）XHTML要素で使用できます。

dir
lang
xml:lang

dir属性

ザ・ dir属性を使用すると、テキストが流れる方向をブラウザに示すことができます。次の表に示すように、dir属性は2つの値のいずれかを取ることができます。

値	意味
ltr	左から右（デフォルト値）
rtl	右から左（ヘブライ語やアラビア語など、右から左に読む言語の場合）

Example

<!DOCTYPE html>
<html dir = "rtl">

   <head>
      <title>Display Directions</title>
   </head>
	
   <body>
      This is how IE 5 renders right-to-left directed text.
   </body>
	
</html>

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

場合は、DIR属性は、<html>タグ内で使用され、それがテキストは、文書全体の中に提示される方法を決定します。別のタグ内で使用すると、そのタグのコンテンツのみのテキストの方向を制御します。

lang属性

ザ・ lang属性を使用すると、ドキュメントで使用される主要言語を示すことができますが、この属性は、以前のバージョンのHTMLとの下位互換性のためにのみHTMLで保持されていました。この属性はに置き換えられましたxml:lang 新しいXHTMLドキュメントの属性。

lang属性の値は、ISO-639標準の2文字の言語コードです。小切手HTML Language Codes: ISO 639 言語コードの完全なリストについては。

Example

<!DOCTYPE html>
<html lang = "en">

   <head>
      <title>English Language Page</title>
   </head>

   <body>
      This page is using English Language
   </body>

</html>

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

xml：lang属性

XML：LANG属性が用XHTMLの交換でのlang属性。xml：lang属性の値は、前のセクションで説明したように、ISO-639国コードである必要があります。

一般的な属性

これは、多くのHTMLタグですぐに使用できる他のいくつかの属性の表です。

属性	オプション	関数
整列	右、左、中央	タグを水平方向に配置します
valign	上、中、下	HTML要素内のタグを垂直方向に配置します。
bgcolor	数値、16進数、RGB値	要素の後ろに背景色を配置します
バックグラウンド	URL	要素の後ろに背景画像を配置します
id	ユーザー定義の	カスケードスタイルシートで使用する要素に名前を付けます。
クラス	ユーザー定義の	カスケードスタイルシートで使用する要素を分類します。
幅	数値	テーブル、画像、またはテーブルセルの幅を指定します。
高さ	数値	テーブル、画像、またはテーブルセルの高さを指定します。
題名	ユーザー定義の	要素の「ポップアップ」タイトル。

他のHTMLタグの調査に進むにつれて、関連する例が表示されます。HTMLタグと関連する属性の完全なリストについては、HTMLタグリストへの参照を確認してください。