Conteúdo do Curso
HTML Supremo
HTML Supremo
Atributos
Os atributos são fundamentais para os elementos HTML, pois fornecem informações suplementares ou instruções sobre um elemento. Ao definir o comportamento, a aparência ou a funcionalidade do elemento, os atributos aumentam sua funcionalidade geral. Os atributos são especificados dentro da tag de abertura de um elemento e consistem em um nome e um valor.
Sintaxe básica
Atributos são especificados apenas dentro dos parênteses angulares da tag de abertura de um elemento. A sintaxe para definir um atributo é a seguinte:
Pontos-chave
- Atributos podem ser opcionais ou obrigatórios: dependendo do elemento, certos atributos podem ser necessários para funcionar corretamente, enquanto outros são opcionais e fornecem opções adicionais de personalização;
- Atributos são envolvidos em aspas: os valores dos atributos são colocados dentro de aspas duplas (
"..."
) ou simples ('...'
). Isso ajuda a distingui-los do nome do elemento e auxilia na legibilidade; - Cada tag tem seu próprio conjunto de atributos: diferentes elementos HTML suportam diferentes atributos. Compreender os atributos específicos aplicáveis a cada elemento é essencial para utilizá-los efetivamente;
- Múltiplos atributos podem ser usados: é possível incluir múltiplos atributos em um único elemento, separando-os com um espaço. Isso permite uma personalização mais extensa e controle sobre o comportamento do elemento.
Exemplo de uso
Vamos explorar alguns exemplos de elementos HTML com atributos para entender como eles impactam o comportamento desses elementos:
index
index
index
Explicação do código linha por linha:
- Elemento
input
;type="text"
especifica que o campo de entrada deve aceitar a entrada de texto simples do usuário;placeholder="name"
fornece uma dica ou um exemplo da entrada esperada no campo de entrada. Esperamos um nome de usuário.
- Elemento
img
;alt="Forest"
fornece um texto alternativo para uma imagem. Se a imagem não carregar, o usuário verá o texto "Forest";src="..."
especifica o URL da origem de uma imagem. Está localizado neste link (https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/forest+example+img.png
) na internet.
- Elemento
a
;target="_blank"
especifica que, quando um usuário clica no link, o URL de destino deve abrir em uma nova aba do navegador;href="https://www.google.com/"
link de destino.
- Elemento
button
.type="reset"
fornece um comportamento de botão que, quando clicado, reinicia os campos do formulário para os seus valores iniciais se o botão estiver especificado dentro do elemento doform
.
Nota
Prosseguiremos com a exploração detalhada dos atributos de cada elemento neste curso. Por enquanto, é fundamental compreender o conceito de atributo, a sua aplicação e o fato de que cada elemento tem o seu conjunto único de atributos. Esses atributos desempenham um papel significativo na alteração da aparência, do propósito e da funcionalidade do elemento.
Resumo
Um elemento HTML geralmente consiste em uma tag, atributos e conteúdo.
- Tag define o tipo de elemento (por exemplo,
p
,img
, etc.); - Atributo fornece informações adicionais sobre o elemento (por exemplo,
src
,alt
, etc.); - Conteúdo é qualquer coisa entre a tag de abertura e de fechamento do elemento.
Obrigado pelo seu feedback!