トップ > スキル : Web > 要素解説

Web

リンク参照に関する要素

<a> (Anchor:アンカー)

意味 ハイパーリンクを設定して、特定のURIに内容を関連付けます。リンク先のパス指定は「href属性」を使用します。
分類 インライン要素
包括可能要素 インライン要素(ただしa要素は除く)
スタイル a:link {color:#00f;text-decoration:under-line;}
a:visited {color:#909;text-decoration:under-line;}
使用上の注意 a要素だけでは意味を持たないので、属性を付けてリンク先との関連を記述します。
リンク先へのパスは「href属性」を使います。
文書内にリンク到達点とするための名前を付けるには「name属性」や「id属性」を使います。
taget属性と使い、値を「_blank」にすることで、半強制的に別のウィンドウを開かせることができるが、閲覧者の行動を妨げる原因にもなるので、使うべきではありません。
a要素の中身だけでリンク先の説明ができなければ、title属性を使って補完します。

■ サンプルコードと結果

HTML

    	<body>
        	<p>日本最大級の検索サイトは<a href="http:⁄⁄www.yahoo.co.jp">
            	Yahoo Japan!</a>です。</p>
    	</body>
    
a結果

<img> (Image:画像)

意味 画像ファイルを読み込んで、ブラウザ上に表示させます。指定する画像ファイルは、「src属性」を使用してパスを記述します。
分類 インライン要素
包括可能要素 なし
スタイル a:link img {border:#00f 2px solid;}
a:visited img {border:#909 2px solid;}
使用上の注意 alt属性を使って代替テキストを記述することは必須です。
意味を持たない装飾画像は、スタイルシートの背景画像として指定するほうが良いです。
width属性、height属性をピクセル単位で指定することで、画面の表示速度が速くなります。

■ サンプルコードと結果

HTML

    	<body>
        	<p><img src="point.gif" alt="飾り絵">文書の前に画像を付けました。</p>
    	</body>
    
img結果

【リンク参照に関する要素】