HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLのhref属性の使い方をわかりやすく解説!リンク作成の基本

HTMLにおけるhref属性は、リンク先のページURLを指定するために使用される属性です。href属性が指定されていない場合、<a>タグはハイパーリンクとして機能しないため注意が必要です。

href属性を使用する際のポイントは以下のとおりです。
・href属性は必ず<a>タグの属性として記述する
・<a>タグは<body>〜</body>タグの内側に記述する

HTMLのhref属性の使い方をわかりやすく解説!リンク作成の基本

コード例

それでは、実際にhref属性を使ってHTMLページ内にページへのリンクを作成してみましょう。以下のコードを参考にしてください。

<!DOCTYPE html>
<html>
   <head>
      <title>HTML href属性のサンプル</title>
   </head>

   <body>
      <h1>会社について知る</h1>
      <a href="/about/index.htm">会社概要</a>
      <a href="/about/about_team.htm">チーム紹介</a>
   </body>
</html>

このコードでは、「会社概要」と「チーム紹介」の2つのリンクを作成しています。それぞれのhref属性には、リンク先のページパス(相対URL)が指定されています。ブラウザで表示すると、テキストをクリックすることで対応するページへ移動できるようになります。

実行結果

HTMLのhref属性の使い方をわかりやすく解説!リンク作成の基本

このように、href属性を使えば簡単にページ間のリンクを実現できます。絶対URL(https://から始まる完全なアドレス)を指定すれば外部サイトへのリンクも作成できるので、ぜひ活用してみてください。

  1. HTMLのmultiple属性とは?複数選択を可能にする使い方を徹底解説

    HTMLのmultiple属性は、ユーザーが複数の値を選択・入力できるようにするための属性です。この属性はブール型(真偽値)属性であり、<input>要素と<select>要素の両方で使用できます。特に、HTMLフォームで複数のファイルをアップロードしたい場合にmultiple属性が活躍します。また、この属性は「email」および「file」タイプの入力フィールドに対応しています。multiple属性の主な特徴fileタイプ:ファイル選択ダイアログで複数のファイルを同時に選択可能になります(CtrlキーやShiftキーを押しながらクリック)。emailタイプ:カンマ区切

  2. HTMLのlist属性とは?datalist要素で入力候補を表示する方法を解説

    HTMLのlist属性とはHTMLでは、<datalist>要素を使用して、あらかじめ定義された選択肢のリストを作成できます。このリストは<input>要素(入力欄)に対して適用され、ユーザーが文字を入力すると、定義済みの選択肢が候補として自動的に表示されます。<input>要素のlist属性は、対応する<datalist>要素のidを参照することで、入力欄と選択肢リストを関連付けます。このlist属性は、HTML5で新たに導入された機能です。list属性の基本的な使い方list属性を使うには、以下の2つのステップを行います。<datali