Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Usando Links e Botões em HTML | Tags e Atributos HTML
HTML Definitivo
course content

Conteúdo do Curso

HTML Definitivo

HTML Definitivo

1. Compreendendo o Desenvolvimento Web
2. Tags e Atributos HTML
3. Estrutura do Documento HTML
4. Trabalhando com Mídia e Tabelas

book
Usando Links e Botões em HTML

Link

A tag <a> é usada para criar hiperlinks que permitem aos usuários navegar entre diferentes páginas da web. Quando um usuário clica em um link, o navegador envia uma solicitação ao servidor para a página associada ao link e exibe a resposta na tela. O atributo href ajuda a especificar a URL da página de destino.

html

index.html

copy

Atributos de Link

target

Por padrão, o link é aberto na mesma aba do navegador. O atributo target permite modificar esse comportamento. Para abrir um link em uma nova aba, utilize target="_blank".

html

index.html

copy

download

O atributo download pode ser utilizado com a tag HTML <a> para especificar que o recurso de destino deve ser baixado em vez de exibido no navegador. Quando o atributo download é utilizado, o navegador solicita ao usuário que salve o arquivo com o nome especificado. Por exemplo, caso seja necessário criar um elemento com a seguinte funcionalidade: ao clicar no link, o navegador fará o download do arquivo "myfile.pdf" de https://example.com/ e solicitará ao usuário que salve o arquivo com o nome myfile.pdf.

html

index.html

copy

href

O atributo href é utilizado não apenas para navegar para outras páginas, mas também para criar links para endereços de e-mail, números de telefone e seções específicas.

html

index.html

copy

Além disso, o atributo href pode ser utilizado para navegar para seções específicas dentro de uma página web. Para criar uma âncora, atribua um atributo id (um identificador único) à seção desejada para a qual queremos rolar. O atributo href recebe um valor iniciado pelo símbolo #, seguido pelo valor do id.

Vamos explorar o exemplo a seguir, apresentado na plataforma CodeSandbox. Esta plataforma permite inspecionar o código e examinar a funcionalidade do código.

Nota

Reserve um momento para inspecionar a funcionalidade clicando nos links e observando como a página ao vivo rola para as seções específicas. Além disso, preste atenção aos atributos da tag a e da tag h2.

Para visualizar o código, arraste o controle deslizante no lado esquerdo do CodeSandbox. Isso revelará o código existente dentro do editor.

Botão

A tag <button> em HTML é utilizada para criar um botão clicável que pode acionar uma ação, como enviar um formulário, executar uma função JavaScript como abrir e fechar uma janela pop-up ou alternar um menu móvel. Por padrão, o <button> possui o atributo type, e seu valor é submit. No entanto, muitas vezes é necessário especificar type="button".

html

index.html

copy

Resumo

A tag <a> é utilizada para criar hiperlinks para outras páginas da web, documentos ou recursos. Em contraste, a tag <button> é usada para criar interatividade em uma página da web, disparando um evento ou executando uma ação. É fundamental não confundir seus propósitos.

1. Qual é a principal função da tag <a>?

2. Você pode usar uma tag <button> para enviar um formulário?

3. Qual é a principal diferença entre a tag <a> e a tag <button>?

question mark

Qual é a principal função da tag <a>?

Select the correct answer

question mark

Você pode usar uma tag <button> para enviar um formulário?

Select the correct answer

question mark

Qual é a principal diferença entre a tag <a> e a tag <button>?

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 2. Capítulo 8
Sentimos muito que algo saiu errado. O que aconteceu?
some-alt