Qual dos seguintes elementos HTML é usado para agrupar informações relacionadas dentro de um formulário?
label
fieldset
(correct)
datalist
button
Qual atributo deve ser utilizado para determinar como os dados do formulário serão enviados?
type
data
action
method
(correct)
Quando o método 'get' é utilizado, como os dados do formulário são enviados?
Em um arquivo XML separado
No corpo do pedido HTTP
Como variáveis na URL
(correct)
De forma oculta em cookies
Qual elemento HTML é apropriado para definir opções em uma lista 'drop-down'?
<p>optgroup (D)</p>
Signup and view all the answers
Qual método deve ser utilizado quando se quer enviar grandes quantidades de dados de um formulário?
<p>post (C)</p>
Signup and view all the answers
Qual elemento HTML permite criar uma lista de opções pré-definida?
<p>datalist (B)</p>
Signup and view all the answers
O que acontece quando um formulário é submetido utilizando o método GET?
<p>Os dados aparecem na URL como parâmetros. (B)</p>
Signup and view all the answers
Qual destes elementos HTML é utilizado para capturar um texto mais longo do usuário?
<p>textarea (C)</p>
Signup and view all the answers
Qual dos seguintes atributos é necessário para evitar que a página trema ao carregar um vídeo?
<p>width (D)</p>
Signup and view all the answers
O que acontece com o texto entre as tags se o browser não suportar o elemento video?
<p>O texto é exibido normalmente (D)</p>
Signup and view all the answers
Qual das alternativas a seguir descreve corretamente o comportamento do elemento em um vídeo?
<p>Especifica formatos alternativos de vídeo que o browser pode reconhecer (D)</p>
Signup and view all the answers
Se um browser não suportar um formato de vídeo especificado, qual arquivo será utilizado?
<p>O primeiro formato reconhecido (A)</p>
Signup and view all the answers
No que diz respeito ao suporte a formatos de imagem, o que deve ser considerado ao usar o elemento ?
<p>Nem todos os browsers suportam todos os formatos de imagem (C)</p>
Signup and view all the answers
Qual atributo deve ser incluído para adicionar controles de vídeo ao elemento
<p>controls (D)</p>
Signup and view all the answers
O que acontece se todos os formatos especificados na tag forem incompatíveis?
<p>Nada ocorrerá e o vídeo não será exibido (B)</p>
Signup and view all the answers
Qual das opções abaixo é uma função do atributo sandbox em um iframe?
<p>Bloquear a submissão de formulários do conteúdo do iframe (B)</p>
Signup and view all the answers
Por que é importante incluir o atributo title em um iframe?
<p>Para ajudar leitores de tela a interpretar o conteúdo (C)</p>
Signup and view all the answers
Qual afirmativa seguinte é verdadeira sobre a utilização do elemento
<p>Os atributos de altura e largura podem ser ignorados (D)</p>
Signup and view all the answers
Qual é o efeito da inclusão de um valor vazio no atributo sandbox?
<p>Aplicar todas as restrições possíveis ao conteúdo (C)</p>
Signup and view all the answers
Quando um formulário HTML é utilizado, a maior parte dos dados do utilizador é geralmente:
<p>Encaminhada para o servidor para processamento (D)</p>
Signup and view all the answers
Qual dos seguintes elementos é essencial para a criação de um formulário HTML?
<form> (A)
Signup and view all the answers
Qual das seguintes afirmações sobre o iframe está incorreta?
<p>O iframe é usado apenas para vídeos em uma página web. (B)</p>
Signup and view all the answers
Qual é um benefício da validação do lado do cliente em formulários HTML?
<p>Reduz o tempo de processamento no servidor. (B)</p>
Signup and view all the answers
O que acontece com o conteúdo de um iframe quando o sandbox está presente?
<p>É tratado como se fosse de uma origem única, com restrições aplicadas. (B)</p>
Signup and view all the answers
Qual é a principal razão para utilizar o método POST ao enviar dados de um formulário?
<p>É necessário para enviar dados que contenham informações sensíveis. (B)</p>
Signup and view all the answers
Qual é a função do elemento
<p>Fornece uma descrição acessível para elementos de entrada. (A)</p>
Signup and view all the answers
O que deve ser feito para associar um elemento
<p>O atributo for do <label> deve ser igual ao id do elemento de entrada. (B)</p>
Signup and view all the answers
Qual atributo é necessário para referenciar os dados do elemento
<p>name (C)</p>
Signup and view all the answers
O que acontece se o atributo name for omitido em um elemento
<p>Os dados da lista não serão submetidos. (D)</p>
Signup and view all the answers
Como pode ser definida uma opção pré-selecionada em um elemento
<p>Aplicando o atributo selected à opção correspondente. (B)</p>
Signup and view all the answers
Qual a finalidade do atributo multiple em um elemento
<p>Habilitar a seleção de mais de uma opção. (A)</p>
Signup and view all the answers
Qual dos seguintes elementos define um botão clicável em HTML?
<p><button> (A)</p>
Signup and view all the answers
Qual dos seguintes tipos de input permite selecionar várias opções simultaneamente?
<p>checkbox (B)</p>
Signup and view all the answers
Qual atributo do elemento input indica que o campo é apenas para leitura?
<p>readonly (D)</p>
Signup and view all the answers
Para qual tipo de input é utilizado o formato 'email'?
<p>Para receber endereços de email (C)</p>
Signup and view all the answers
Qual é a característica principal do tipo de input 'date'?
<p>Permite escolher uma data através de um calendário (A)</p>
Signup and view all the answers
O que acontece quando um campo de input está desativado?
<p>O valor do campo não é enviado na submissão do formulário (C)</p>
Signup and view all the answers
Qual tipo de input exibe uma imagem como botão de envio?
<p>image (C)</p>
Signup and view all the answers
O que o atributo 'value' faz em um campo de input?
<p>Especifica o valor inicial do campo (D)</p>
Signup and view all the answers
Qual dos seguintes tipos de input é utilizado para selecionar ficheiros?
<p>file (C)</p>
Signup and view all the answers
Qual atributo deve ser utilizado em um campo de entrada do tipo email para permitir múltiplos valores?
<p>multiple (D)</p>
Signup and view all the answers
Qual é a função do atributo 'pattern' em um campo de entrada?
<p>Definir uma expressão regular para validar o valor (A)</p>
Signup and view all the answers
Para qual tipo de input o atributo 'required' pode ser utilizado?
<p>Em diversos tipos de input como text, email, password e checkbox (D)</p>
Signup and view all the answers
Quais tipos de input podem utilizar o atributo 'placeholder'?
<p>text, search, url, tel, email e password (A)</p>
Signup and view all the answers
Qual atributo permite que um campo de entrada obtenha o foco automaticamente quando a página é carregada?
<p>autofocus (B)</p>
Signup and view all the answers
Qual é a característica correta do atributo 'autocomplete'?
<p>Ele pode ativar ou desativar o preenchimento automático (D)</p>
Signup and view all the answers
Qual é o intervalo permitido para o campo de entrada da idade?
<p>0 a 60 (D)</p>
Signup and view all the answers
Qual é a função do atributo 'size' em um campo de entrada?
<p>Determina a largura visível do campo em caracteres (A)</p>
Signup and view all the answers
Flashcards
Elemento iframe
Um elemento HTML que cria um quadro para exibir outro documento HTML dentro da página atual.
Atributo title (iframe)
Atributo essencial para descrever o conteúdo do iframe para leitores de telas.
Atributo src (iframe)
Define a URL do documento HTML a ser inserido no iframe.
Atributo sandbox
Permite controlar o comportamento do conteúdo dentro do iframe, restringindo suas ações.
Signup and view all the flashcards
Formulário HTML
Um elemento HTML que coleta dados do usuário, geralmente para submissão a um servidor.
Signup and view all the flashcards
Validação de formulário cliente-lado
Verificação de dados inseridos antes do envio do formulário ao servidor, melhorando a experiência do usuário.
Signup and view all the flashcards
Formatos de imagem suportados
Alguns navegadores ou dispositivos podem não suportar todos os formatos de imagem. O elemento permite adicionar imagens de vários formatos, e o navegador utilizará o primeiro que reconhecer, ignorando os outros.
Signup and view all the flashcards
Elemento
Mostra/reproduz um vídeo na página. O atributo 'controls' adiciona controles como play/pause/volume. Largura e altura são essenciais para evitar problemas de carregamento.
Signup and view all the flashcards
Atributo 'controls' em
Adiciona controles de reprodução, pausa e volume a vídeos no elemento
Signup and view all the flashcards
Atributos 'width' e 'height' em
São essenciais para a exibição correta do vídeo, evitando trepidações durante o carregamento.
Signup and view all the flashcards
Elemento
Permite especificar ficheiros de vídeo alternativos. Navegadores utilizam o primeiro formato compativel.
Signup and view all the flashcards
Fallback para
Caso o navegador não suporte o elemento
Signup and view all the flashcards
Elemento form (POST)
Utilizar o método POST em formulários quando os dados contiverem informações sensíveis ou pessoais.
Signup and view all the flashcards
Elemento label
Fornece uma descrição para outros elementos do formulário, auxiliando leitores de tela e usuários com dificuldades em clicar em áreas pequenas.
Signup and view all the flashcards
Elemento select
Cria uma lista suspensa (drop-down) permitindo a escolha de uma única opção (ou múltiplas com o atributo "multiple").
Signup and view all the flashcards
Elemento option
Define uma opção individual dentro de uma lista suspensa ('select').
Signup and view all the flashcards
Atributo 'size' (select)
Define o número de opções visíveis na lista suspensa.
Signup and view all the flashcards
Atributo 'multiple' (select)
Permite que o usuário selecione múltiplas opções no elemento 'select'.
Signup and view all the flashcards
Atributo 'for' (label)
Atributo do elemento label que deve ser associado ao atributo 'id' do elemento de formulário.
Signup and view all the flashcards
Atributo 'id' (label/select/etc.)
Identificador único para associar elementos no formulário (e.g., label e select).
Signup and view all the flashcards
Atributo 'name' (select)
Identifica o campo de formulário para processamento de dados após o envio.
Signup and view all the flashcards
Elemento button
Cria um botão clicável para disparar ações ou enviar dados de formulário.
Signup and view all the flashcards
Elemento HTML form
Elemento HTML usado para criar formulários para coletar dados de entrada do usuário.
Signup and view all the flashcards
Elemento HTML label
Elemento HTML usado para definir uma descrição para outros elementos de formulário.
Signup and view all the flashcards
Elemento HTML input
Elemento HTML usado para receber dados de entrada do usuário, como texto, senhas, e-mail, etc.
Signup and view all the flashcards
Elemento HTML button
Elemento HTML que representa um botão clicável para executar ações ou enviar dados do formulário.
Signup and view all the flashcards
Elemento HTML select
Elemento HTML usado para criar menus dropdown (listas suspensas) de opções.
Signup and view all the flashcards
Elemento HTML textarea
Elemento HTML para permitir entrada de texto em várias linhas.
Signup and view all the flashcards
Elemento HTML fieldset
Elemento HTML para agrupar elementos de formulário relacionados, adicionando um quadro ao redor.
Signup and view all the flashcards
Elemento HTML legend
Elemento HTML usado para descrever um bloco de formulário agrupado pelo fieldset.
Signup and view all the flashcards
Elemento HTML datalist
Elemento HTML que fornece uma lista pré-definida de opções para campos input.
Signup and view all the flashcards
Atributo action (form)
Atributo do elemento form que especifica o caminho para o destino ao submeter os dados.
Signup and view all the flashcards
Método GET
Método HTTP para enviar dados do formulário como parte da URL.
Signup and view all the flashcards
Método POST
Método HTTP para enviar dados do formulário no corpo do pedido HTTP.
Signup and view all the flashcards
Input type 'reset'
Botão que redefini todos os valores do formulário aos seus valores predefinidos.
Signup and view all the flashcards
Input type 'radio'
Botões de opção, onde apenas um pode ser selecionado.
Signup and view all the flashcards
Input type 'checkbox'
Caixas de seleção, permitindo a seleção de nenhuma ou várias opções.
Signup and view all the flashcards
Input type 'button'
Botão que não submete automaticamente os dados do formulário.
Signup and view all the flashcards
Input type 'color'
Campo de entrada para cores, possivelmente com seletor de cores.
Signup and view all the flashcards
Input type 'date'
Campo para entrada de datas.
Signup and view all the flashcards
Input type 'datetime-local'
Campo para entrada de datas e horários, possivelmente com calendário.
Signup and view all the flashcards
Input type 'email'
Campo para entrada de endereços de e-mail, podendo ser validado automaticamente.
Signup and view all the flashcards
Input type 'image'
Uma imagem como botão de envio de formulário.
Signup and view all the flashcards
Input type 'file'
Campo de seleção de arquivos e botão 'Procurar'.
Signup and view all the flashcards
Atributo 'value' (input)
Especifica o valor inicial do campo de entrada.
Signup and view all the flashcards
Atributo 'readonly' (input)
O campo é de só leitura, mas o valor é enviado na submissão.
Signup and view all the flashcards
Atributo 'disabled' (input)
O campo fica desativado, seu valor não é enviado.
Signup and view all the flashcards
Atributo size (input)
Especifica a largura, em caracteres, de um campo de entrada de texto. Útil apenas para inputs tipo text, search, tel, url, email e password.
Signup and view all the flashcards
Atributo multiple (input)
Permite ao usuário inserir múltiplos valores em campos de entrada do tipo email e file.
Signup and view all the flashcards
Atributo pattern (input)
Define uma expressão regular para validar o valor de um campo de entrada. Usado para tipos text, date, search, url, tel, email, password.
Signup and view all the flashcards
Atributo placeholder (input)
Exibe uma dica no input, mostrando o formato de entrada esperado, até o usuário digitar algo.
Signup and view all the flashcards
Atributo required (input)
Obriga o usuário a preencher o campo antes de submeter o formulário. Usado em vários tipos de campo.
Signup and view all the flashcards
Atributo autofocus (input)
Posiciona o cursor no campo de entrada assim que a página carrega.
Signup and view all the flashcards
Atributo autocomplete (input)
Controla o preenchimento automático em campos específicos, no próprio input ou no form.
Signup and view all the flashcards
Campo Nome (formulário)
Campo obrigatório para inserir o nome completo do usuário no formulário.
Signup and view all the flashcards
Campo Género (formulário)
Campo para selecionar o gênero (M ou F) do usuário, com apenas uma opção válida.
Signup and view all the flashcards
Campo Idade (formulário)
Campo numérico obrigatório, limitando a idade entre 0 e 60 anos.
Signup and view all the flashcards
Dropdown CtesP
Dropdown contendo as opções para o curso CtesP, sendo DW a primeira opção.
Signup and view all the flashcards
Study Notes
HTML - Links
Links são facilmente identificados ao passar o mouse sobre eles, a seta transforma-se numa mãozinha.
Uma hiperligação pode ser texto, imagem ou outro elemento HTML.
O atributo href especifica o destino de uma hiperligação.
Links não visitados são geralmente sublinhados em azul.
Links visitados são sublinhados em roxo.
Links ativos são sublinhados em vermelho.
Os estilos de links podem ser alterados usando CSS.
O documento destino é normalmente aberto na mesma janela, a menos que outro destino seja especificado.
Caminho absoluto: href="https://www...." aponta para um documento em outro servidor.
Caminho relativo: href="/path..." aponta para um documento no mesmo servidor.
../ refere-se à pasta superior.
HTML - Exercícios
Criar link para email: href="mailto:..."
Título e destinatários de email podem ser definidos.
Espaços nos URLs devem ser substituídos por %20 (UTF-8).
HTML - Links internos
href="#value" para navegação dentro da página, evitando rolagem desnecessária.
# no href indica que é um ponto de ancoragem.
id do elemento destino deve corresponder ao valor no atributo href.
HTML - Imagem
A tag <img> insere imagens numa página.
Imagens estão ligadas à página, não inseridas diretamente dentro da página.
<img> cria espaço para a imagem.
O atributo obrigatório src especifica o caminho da imagem.
O atributo obrigatório alt descreve a imagem em caso de falha de carregamento.
HTML -
<picture> permite diferentes imagens em diferentes tamanhos de ecrã.
Usando <source> e seus atributos media, permite selecionar imagens apropriadas para diferentes dispositivos.
O browser escolhe a imagem que melhor se adapta ao dispositivo.
O elemento <img> é obrigatório, caso <source> não corresponda a nenhuma condição.
HTML -
<video> insere um vídeo na página.
O atributo controls adiciona controlos de vídeo (reproduzir, pausar, volume).
Os atributos width e height são necessários para definir as dimensões do vídeo.
<source> permite fornecer diferentes formatos de vídeo para diferentes browsers.
HTML -
<audio> reproduz áudio numa página.
O atributo controls adiciona controlos de áudio (reproduzir, pausar, volume).
<source> permite fornecer diferentes tipos de ficheiros áudio para diferentes browsers.
HTML - YouTube
<iframe> insere vídeos do YouTube.
O atributo src especifica a URL do vídeo do YouTube.
Atributos width, height controlam o tamanho do vídeo.
Parâmetros na URL podem controlar o comportamento do vídeo (ex. autoplay, mute).
HTML - <iframe>
<iframe> cria um "quadro" para incorporar outro documento HTML.
O atributo src aponta para a localização do documento que será exibido no <iframe>.
HTML - Formulários
Formulários recolhem dados do utilizador e enviam para um servidor.
Elementos HTML para recolha de dados (ex: input, textarea, select).
<form> define o contêiner do formulário.
action: indica onde enviar os dados.
method: indica se os dados são enviados como query string (get) ou como body HTTP (post). Evite get para dados sensíveis.
autocomplete: controla o preenchimento automático. <novalidate> impede validação.
<label> associa a descrição ao elemento de entrada.
É importante garantir que for e id coincidam para associar o rótulo ao item.
<label> facilita a leitura para utilizadores com acesso às telas de leitura.
<input> para diferentes tipos de entradas: texto, senha, checkbox, rádio, etc.
<select> para listas de seleção com opções (<option>).
<optgroup> para agrupar opções de <option>.
<textarea> para entrada de texto múltipla linha.
<button> elemento para criar um botão. O atributo type ajuda o browser entender como ele será tratado.
<fieldset> e <legend>: agrupar elementos para organização visual
<datalist> (menos comum): lista pré-definida de opções para entrada.
HTML - Atributos <form>
action: especifica o URL onde os dados serão enviados.
method: especifica o método HTTP usado na submissão. GET adiciona os dados como query string, POST como body HTTP.
Preferir POST para dados sensíveis.
autocomplete: controla o preenchimento automático.
novalidate: desabilita a validação do formulário.
target: especifica onde o resultado da submissão será apresentado (ex: nova janela, mesma janela).
Atributos com type para input
Tipos de input: text, password, submit, reset, checkbox, radio, color, date, datetime-local, email, file, hidden, image, month, number, password, range, search, tel, time, url , etc.
Usar atributos min, max, etc, onde aplicável para entradas numéricas ou data.
Studying That Suits
You
Use AI to generate personalized quizzes and flashcards to suit your learning preferences.
