Como fazer HTML abrir um hiperlink em outra janela ou guia?


91

Esta é uma linha para um hiperlink em HTML:

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

Portanto, se eu clicar em "Starfall", meu navegador - estou usando o FireFox - me levará para essa nova página e o conteúdo da minha janela será alterado. Eu me pergunto, como posso fazer isso em HTML para que a nova página seja aberta em uma nova janela em vez de alterar a anterior? Existe tal forma em HTML?

E se sim, há como abrir a página solicitada em outra aba (não em outra janela) do meu navegador?

Respostas:


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

Se ele abre em uma guia ou outra janela, depende de como o usuário configurou seu navegador.


6
Nem todos os navegadores suportam guias e, naqueles que suportam, as páginas que abrem em uma nova guia em vez de uma nova janela é uma configuração configurável pelo usuário. Não existe uma maneira atual de especificar que um link precisa ser aberto em uma guia em vez de uma janela.
bta

2
lembre-se de que o atributo target deve ser declarado APÓS o atributo href
MC

107

A maneira mais simples é adicionar uma tag de destino.

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

Use um valor diferente para o atributo de destino para cada link se você quiser que eles abram em guias diferentes, o mesmo valor para o atributo de destino se você quiser que eles substituam os outros.


45
+1 para apontar que o alvo não precisa ser '_blank'.
GSto

4
É importante notar que este é um HTML5 válido.
AeroCross

O que você quer dizer com 'nome'?
Vnge

8

usar target="_blank"

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


7

Você deve ser capaz de adicionar

target="_blank"

gostar

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

6

O targetatributo é a sua melhor maneira de fazer isso.

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

irá abri-lo em uma nova guia ou janela. Quanto a isso, depende das configurações dos usuários.

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

é o padrão. Isso faz com que a página abra na mesma guia (ou iframe, se é disso que você está lidando).
Os próximos dois são bons apenas se você estiver lidando com um iframe.

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

abrirá o link no iframe em que estava o iframe que continha o link.

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

irá abrir o link na guia, não importa quantos iframes ele precise percorrer.


como faço para usar esse texto colorido nos exemplos de todos os outros?
hellol11

5

o target = _blank is abrirá em uma nova guia ou janela com base na configuração do navegador.

Para forçar uma nova janela, use javascript onclick, todas as três partes são necessárias. url, um nome e a largura e altura da janela ou apenas abrirá em uma nova guia.

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

4

Você também pode fazer isso adicionando o seguinte ao cabeçalho da sua página:

<base target="_blank">

Isso fará com que TODOS os links da sua página abram em uma nova guia


4

Como a web está evoluindo rapidamente, algumas coisas mudam com o tempo. Por questões de segurança, você pode querer usar o rel="noopener"atributo em conjunto com o seu target="_blank".

Como declarado na documentação do Google Dev , a outra página pode acessar seu objeto de janela com o window.opener property. Seu link externo deve se parecer com este agora:

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

<a href="http://www.starfall.com/" target="_blank" rel="noopener noreferrer">Starfall</a>hoje em dia, parece ser a melhor prática ter os dois
ContextCue

1

exemplo abaixo com target="_blank"trabalhos para Safari e Mozilla

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

Usando target="new"funcionou para o Chrome

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

2
o que distingue sua resposta entre dezenas de outras?
Farside
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.