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

HTMLでリンクのターゲット(開き先)を変更する方法【target属性の使い方】

HTMLでリンクのターゲット(開き先)を変更するには、<a>〜</a>タグのtarget属性を使用します。target属性を指定することで、リンク先を新しいタブで開いたり、同じタブで開いたりと、ページの表示方法を柔軟に制御できます。

target属性に指定できる値

属性値説明
_blankリンク先のページを新しいタブで開きます。
_selfリンク先のページを現在のタブ(同じフレーム)で開きます。省略時のデフォルト値です。
_parentリンク先のページを親フレームで開きます。
_topリンク先のページを最上位のフレームで開きます。フレーム構成を解除して全画面表示にしたい場合に使います。

HTMLでリンクのターゲット(開き先)を変更する方法【target属性の使い方】

使用例:リンクを新しいタブで開く

以下のコードを実行すると、リンクのターゲットを変更する動作を実際に確認できます。この例では、target="_blank" を指定して、リンク先を新しいタブで開くように設定しています。

<!DOCTYPE html>
<html>
   <head>
      <title>HTML link target</title>
   </head>
  <body>
      <h2>参考サイト</h2>
      <p>
         次の<a href="https://www.qries.com/questions.php"
            target="_blank">ウェブサイト</a>を参照してください。
         上記のリンクは新しいタブで開きます。
      </p>
  </body>
</html>

補足:セキュリティのためのrel属性

target="_blank" を使用する場合は、セキュリティ対策として rel="noopener noreferrer" を一緒に指定するのが推奨されています。これにより、リンク先のページから元のページが操作される「リバースタブナビング(Tabnabbing)」と呼ばれる攻撃を防ぐことができます。

  1. HTMLでリンクの色を変更するにはどうすればよいですか?

    HTMLでリンクの色を変更する基本HTMLでリンクの色を変更するには、CSSの「color」プロパティを使用します。具体的には、style属性と組み合わせて指定します。style属性は、個々の要素に対してインラインスタイルを適用するための属性です。リンク(<a>タグ)にstyle属性を追加し、そこへcolorプロパティを記述することで、リンクの色を自由に変更できます。ただし、1点注意が必要です。style属性によるインラインスタイルは最も優先度が高いため、<style>タグや外部スタイルシートで設定されたスタイルは上書きされてしまいます。コード例以下のコードを実行すると

  2. Excelでワークシートタブの色を変更して見やすく整理する方法

    Microsoft Excelで選択中のワークシートタブは白く表示されますが、タブに色を付けて視覚的に区別しやすくしたいと思ったことはありませんか?ワークシートタブに色を追加すると、作業内容を整理でき、複数のシートをひと目で見分けられるようになります。大量のワークシートを扱っている場合でも、色分けしておけば目的のシートに素早くアクセスできるので非常に便利です。 Excelでは、タブの色を設定する際に「テーマの色」「標準色」「色なし」「その他の色」から選択できます。「その他の色」を選ぶと「色」というダイアログボックスが開き、標準色とユーザー設定の色が利用可能です。ユーザー設定の色を使えば、選ん