HTML属性
HTML属性は、HTML要素に関する追加情報を提供します。
HTML属性
・すべてのHTML要素に属性を持つことができます。
・属性は要素に関する追加情報を提供します。
・属性は常に開始タグで指定します。
・属性は通常、次のような名前と値のペアで提供されます。名前="値"
href 属性
<a>
タグはハイパーリンクを定義します。href
属性は、リンク先のページのURLを指定します。
リンクの詳細については、HTMLリンクの章を参考にしてください。
src属性
<img>
タグは、HTMLページに画像を埋め込むために使用されます。src
属性は、表示する画像へのパスを指定します。
src
属性でURLを指定する方法は2つあります。
1.絶対URL- 別のWebサイトでホストされている外部画像へのリンク。
例: src="https://techis.jp/images/img_girl.jpg"。
注:外部画像は著作権で保護されている場合があります。無断で使用した場合、著作権法に違反する可能性があります。さらに、外部イメージを制御することはできません。突然削除または変更される可能性があります。
2. 相対 URL- Web サイト内でホストされている画像へのリンク。ここでは、URLにドメイン名が含まれていません。 URLがスラッシュなしで始まる場合、現在のページに対する相対URLになります。例: src="img_girl.jpg"。 URLがスラッシュで始まる場合は、ドメインに対して相対的になります。例: src="/images/img_girl.jpg"。
ヒント:ほとんどの場合、相対URLを使用することをお勧めします。ドメインを変更しても壊れません。
幅と高さの属性
<img>
タグには、width
とheight
(ピクセル単位)で画像の幅と高さを指定する属性を加えることもできます。
alt属性
<img>
タグのalt
属性は、何らかの理由で画像を表示できない場合に、画像の代替テキストを指定します。これは、接続が遅いか、src
属性、またはユーザーがスクリーンリーダーを使用していることが原因の可能性があります。
画像の詳細については、HTML 画像の章を参考にしてください。
スタイル属性
style
属性は、色、フォント、サイズなどのスタイルを要素に追加するために使用されます。
スタイルの詳細については、HTMLスタイルの章を参考にしてください。
言語属性
<html>
タグ内部のlang
属性で、Webページの言語を宣言します。これは、検索エンジンとブラウザを支援するためのものです。
次の例では、言語として英語を指定しています。
国コードは、言語コードをlang
属性に追加することもできます。したがって、最初の2文字はHTML ページの言語を定義し、最後の2文字は国を定義します。
次の例では、言語として英語を指定し、国として米国を指定しています。
すべての言語コードは、HTML 言語コードリファレンスを参考にして下さい。
タイトル属性
title
属性は、要素に関するいくつかの追加情報を定義します。
要素の上にマウスを置くと、title属性の値がツールチップとして表示されます。
推奨 : 常に小文字の属性を使用する
HTML標準では、小文字の属性名は必要ありません。
title属性(および他のすべての属性)は、title、TITLEのように大文字または小文字で記述できます。
ただし、HTMLは小文字の属性を推奨しており、XTHMLのような厳密なドキュメントタイプは小文字の属性を要求します。
テックアイエスでは、常に小文字の属性名を使用しています。
推奨 : 常に属性値は引用符で囲む
HTML標準では、属性値を引用符で囲む必要はありません。
ただし、HTMLでの引用を推奨しており、XHTMLのような厳密なドキュメントタイプついては引用を要求します。
良い例
悪い例
場合によっては、引用符を使用する必要があります。次の例では、タイトル属性にスペースが含まれているため、正しく表示されません。
テックアイエスでは、常に属性値を引用符で囲みます。
一重引用符か二重引用符か?
HTMLでは、属性値を二重引用符で囲むのが最も一般的ですが、一重引用符も使用できます。
属性値自体に二重引用符が含まれている場合、一重引用符を使用する必要がある場合があります。
またはその逆
この章のまとめ
・すべてのHTML要素は属性を持つことが出来る。
・<a>
タグのhref
は属性リンク先のページのURLを指定します。
・<img>
タグのsrc
属性は表示する画像へのパスを指定します。
・<img>
タグのwidth
とheight
属性 は画像のサイズ情報を指定します。
・<img>
タグのalt
属性は画像の代替テキストを提供します。
・style
属性は色、フォント、サイズなどの要素にスタイルを追加するために使用されます。
・<html>
タグのlang
属性は、ウェブページの言語を宣言します。
・title
属性は要素に関する追加情報を定義します。
HTML属性リファレンス
各HTML要素のすべての属性の完全なリストは、以下にリストされています。HTML属性リファレンス
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。