HTMLリンク
HTML はハイパーリンクを使用して、Web 上の別のドキュメントに接続します。
リンクはほぼすべての Web ページにあります。リンクをクリックすると、あるページから別のページにジャンプします。
まずリンクの例を見てみましょう
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>php.cn</title> </head> <p><a href="/">PHP中文网</a> 是一个指向本网站中的一个页面的链接。</p> <p><a href="http://www.baidu.com/">百度</a>这是一个指向百度的链接</p> </body> </html>
コードの実行結果:
HTML ハイパーリンク (リンク)
HTML はタグ <a> を使用してハイパーテキスト リンクを設定します。
ハイパーリンクには、単語、単語、単語のグループ、または画像を指定できます。これらのコンテンツをクリックすると、新しいドキュメントまたは現在のドキュメントの特定の部分にジャンプできます。
ウェブページ内のリンク上にマウスポインタを移動すると、矢印が小さな手に変わります。
href 属性は、タグ <a> でリンクのアドレスを記述するために使用されます。
たとえば、php.cn サイトのホームページへのリンクは次のように表現できます:
<a href="http://www.php.cn"> ;PHP 中国語 Web サイト< ;/a>
デフォルトでは、リンクはブラウザに次のように表示されます:
アクセスされていないリンク します青色のフォントと下線で表示されます。
がアクセスしたリンクは紫色で表示され、下線が引かれています。
リンクをクリックすると、リンクは赤色で表示され、下線が付きます。
注: これらのハイパーリンクに CSS スタイルが設定されている場合、表示スタイルは CSS 設定に従って表示されます。
HTML 接続 - id 属性
id 属性は、HTML ドキュメント内にブックマーク タグを作成するために使用できます。
ヒント: ブックマークは特別な方法で表示されるわけではなく、HTML ドキュメントにも表示されないため、読者には表示されません。
HTML ドキュメントに ID を挿入:
<a id="tips">役立つヒント セクション</a>
HTML ドキュメント内に「役立つヒント セクション」へのリンクを作成します( id="tips ")":
<a href="#tips">役立つヒント セクションにアクセス</a>
または、別のページのヒント セクションから「役立つヒント」へのリンクを作成します (id= "ヒント")":
<a href="http://www.php.cn/html/html-links.html#tips">
役立つヒント セクションにアクセス </a>
基本的な注意事項
注: サブフォルダーには必ずスラッシュを追加してください。 href="http://www.php.cn/html" のようにリンクを記述すると、サーバーに対して 2 つの HTTP リクエストが生成されます。これは、サーバーがアドレスにスラッシュを追加して、次のような新しいリクエストを作成するためです: href="http://www.php.cn/html/"。
例
画像リンクの使用方法。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>php.cn</title> </head> <body> <p>创建图片链接: <a href="http://www.php.cn/"> <img src="1.jpg" alt="HTML 教程" width="50" height="50"></a></p> <p>无边框的图片链接: <a href="http://www.php.cn/html/"> <img border="0" src="1.jpg" alt="HTML 教程" width="50" height="50"></a></p> </body> </html>
画像では<img>タグを使用していますが、これについては後述します
コードの実行結果:
上の画像をクリックするとhttp://www .php.cn/ このウェブサイト
