iPentec.com / Doc / HTML / HTMLタグ / Aタグ

リンクをクリックした際に、Webブラウザーの別ウィンドウでリンク先のページを開く - HTML

リンクをクリックした際に、Webブラウザの別ウィンドウでリンク先のページを開くコードを紹介します。

概要

HTMLページのリンクをクリックしたときにWebブラウザの新しいウィンドウでリンクを開く動作にする場合はAタグのtarget属性に_blankを指定します。

書式

<a href="遷移先URL" target="_blank">リンク文字列</a>

例

コード

下記のHTMLファイルを作成します。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <a href="https://www.ipentec.com" target="_blank">iPentec.com へのリンク</a>
</body>
</html>

解説

https://www.ipentec.comへのリンクです。target="_blank" を記述しているため、新しいウィンドウでリンク先のページが開かれます。

  <a href="https://www.ipentec.com" target="_blank">iPentec.com へのリンク</a>

実行結果

上記のHTMLページをWebブラウザで表示します。下図のページが表示されます。 [iPentec.com へのリンク]をクリックします。

クリックすると別タブでipentec.comのWebページが表示できました。

リンククリックで新しいタブを開いてページ遷移するリンクを作成できました。

補足:JavaScriptでの実装

JavaScriptでリンククリック時に新しいウィンドウを開くロジックを実装する方法もあります。詳しくはこちらの記事を参照してください。

このページのキーワード

HTML リンク別ウィンドウ
リンク別窓
リンク別ウィンドウ
リンク新しいウィンドウ

著者

とりっち

iPentecのメインデザイナー
Webページ、Webクリエイティブのデザインを担当。PhotoshopやIllustratorの作業もする。

目次

リンクをクリックした際に、Webブラウザーの別ウィンドウでリンク先のページを開く - HTML

概要

書式

例

コード

解説

実行結果

関連するページ