Comment faire en sorte que HTML ouvre un hyperlien dans une autre fenêtre ou un autre onglet?

91

Ceci est une ligne pour un lien hypertexte en HTML:

<a href="http://www.starfall.com/">Starfall</a>

Ainsi, si je clique sur "Starfall", mon navigateur - j'utilise FireFox - m'amènera à cette nouvelle page et le contenu de ma fenêtre changera. Je me demande, comment puis-je faire cela en HTML pour que la nouvelle page soit ouverte dans une nouvelle fenêtre au lieu de changer la précédente? Existe-t-il un tel moyen en HTML?

Et si oui, existe-t-il un moyen d'ouvrir la page demandée dans un autre onglet (pas une autre fenêtre) de mon navigateur?

brillant
la source

Réponses:

135
<a href="http://www.starfall.com/" target="_blank">Starfall</a>

Qu'il s'ouvre dans un onglet ou une autre fenêtre dépend de la façon dont un utilisateur a configuré son navigateur.

Franc
la source
6
Tous les navigateurs ne prennent pas en charge les onglets et dans ceux qui le font, les pages s'ouvrant dans un nouvel onglet par rapport à une nouvelle fenêtre sont un paramètre configurable par l'utilisateur. Il n'existe actuellement aucun moyen de spécifier qu'un lien doit s'ouvrir dans un onglet par rapport à une fenêtre.
bta le
2
rappelez-vous que l'attribut cible doit être déclaré APRÈS l'attribut href
MC
107

Le moyen le plus simple est d'ajouter une balise cible.

<a href="http://www.starfall.com/" target="Starfall">Starfall</a>

Utilisez une valeur différente pour l'attribut cible pour chaque lien si vous souhaitez qu'ils s'ouvrent dans différents onglets, la même valeur pour l'attribut cible si vous souhaitez qu'ils remplacent les autres.

Clé en main
la source
45
+1 pour avoir souligné que la cible ne doit pas être «_blank».
GSto
4
Il convient de noter qu'il s'agit d'un HTML5 valide.
AeroCross
Qu'entendez-vous par «nom»?
Vnge le
8

utilisation target="_blank"

<a target='_blank' href="http://www.starfall.com/">Starfall</a>

jldupont
la source
7

Vous devriez pouvoir ajouter

target="_blank"

comme

<a href="http://www.starfall.com/" target="_blank">Starfall</a>
Jason
la source
6

L' targetattribut est votre meilleur moyen d'y parvenir.

<a href="http://www.starfall.com" target="_blank">

l'ouvrira dans un nouvel onglet ou une nouvelle fenêtre. Quant à cela, cela dépend des paramètres des utilisateurs.

<a href="http://www.starfall.com" target="_self">

est la valeur par défaut. Cela rend la page ouverte dans le même onglet (ou iframe, si c'est ce à quoi vous avez affaire).
Les deux suivants ne sont bons que si vous avez affaire à une iframe.

<a href="http://www.starfall.com" target="_parent">

ouvrira le lien dans l'iframe dans lequel se trouvait l'iframe contenant le lien.

<a href="http://www.starfall.com" target="_top">

ouvrira le lien dans l'onglet, quel que soit le nombre d'iframes à parcourir.

hellol11
la source
comment utiliser ce texte coloré dans chacun des autres exemples?
hellol11
5

la cible = _blank est ouverte dans un nouvel onglet ou une nouvelle fenêtre en fonction des paramètres du navigateur.

Pour forcer une nouvelle fenêtre, utilisez javascript en cliquant sur les trois parties sont nécessaires. url, un nom, la largeur et la hauteur de la fenêtre ou il s'ouvrira simplement dans un nouvel onglet.

<a onclick="window.open('http://www.starfall.com/','name','width=600,height=400')">Starfall</a>
L'Andyman
la source
4

Vous pouvez également accomplir cela en ajoutant ce qui suit à l'en-tête de votre page:

<base target="_blank">

Cela ouvrira TOUS les liens de votre page dans un nouvel onglet

patrick
la source
4

Puisque le Web évolue rapidement, certaines choses changent avec le temps. Pour des problèmes de sécurité, vous souhaiterez peut-être utiliser l' rel="noopener"attribut en conjonction avec votre target="_blank".

Comme indiqué dans la documentation Google Dev , l'autre page peut accéder à votre objet de fenêtre avec l'extension window.opener property. Votre lien externe devrait ressembler à ceci maintenant:

<a href="http://www.starfall.com/" target="_blank" rel="noopener">Starfall</a>
JoeMecPak
la source
<a href="http://www.starfall.com/" target="_blank" rel="noopener noreferrer">Starfall</a>ces jours-ci, il semble être la meilleure pratique d'avoir les deux
ContextCue
1

exemple ci-dessous avec des target="_blank"travaux pour Safari et Mozilla

<a href="http://www.starfall.com" `target="_blank"`>

Utilisation de target="new"travaillé pour Chrome

<a href="http://www.starfall.com" `target="new"`>
scottmoo
la source
2
qu'est-ce qui distingue votre réponse parmi des dizaines d'autres?
Farside