HTML - Links e Formulários
143 Questions
0 Views

HTML - Links e Formulários

Created by
@jorgecosta

Podcast

Play an AI-generated podcast conversation about this lesson

Questions and Answers

O elemento HTML especifica um inline frame, isto é, um quadro onde se coloca/adiciona um outro documento _____.

html

Deve-se sempre incluir o atributo _____ no elemento iframe, para que os leitores de ecrã possam ler do que se trata o conteúdo.

title

O atributo sandbox permite um conjunto extra de _____ para o conteúdo do iframe.

restrições

Quando o atributo sandbox está presente, este tratará o conteúdo como sendo de uma _____ única.

<p>origem</p> Signup and view all the answers

Um formulário HTML é utilizado para recolher dados do _____ do utilizador.

<p>utilizador</p> Signup and view all the answers

Facilitar a recolha de dados do utilizador através de vários elementos é uma das finalidades do _____ HTML.

<p>formulário</p> Signup and view all the answers

O formulário HTML pretende-se estruturar elementos de 'data _____' através de elementos form.

<p>input</p> Signup and view all the answers

Suportar validação do lado do _____ para uma melhor experiência do utilizador é um objetivo dos formulários HTML.

<p>cliente</p> Signup and view all the answers

O atributo ______ inicia automaticamente o vídeo.

<p>autoplay</p> Signup and view all the answers

O símbolo # no atributo href indica ao browser que se trata de uma âncora de ___ .

<p>navegação</p> Signup and view all the answers

Ao usar ______ muted, o vídeo inicia sem som.

<p>autoplay</p> Signup and view all the answers

A tag HTML ___ é utilizada para incorporar uma imagem numa página web.

<p>img</p> Signup and view all the answers

O elemento ______ permite reproduzir um ficheiro de áudio numa página web.

<p>audio</p> Signup and view all the answers

A tag img contém apenas ___ e não tem uma closing tag.

<p>atributos</p> Signup and view all the answers

O atributo ______ adiciona controlos de áudio, como reprodução e pausa.

<p>controls</p> Signup and view all the answers

O elemento ______ permite especificar ficheiros de áudio alternativos.

<p>source</p> Signup and view all the answers

A tag img tem dois atributos obrigatórios: src e ___ .

<p>alt</p> Signup and view all the answers

O elemento HTML ___ permite apresentar imagens diferentes para diferentes dispositivos ou tamanhos de ecrã.

<p>picture</p> Signup and view all the answers

O código ______ é utilizado para reproduzir um vídeo do YouTube em HTML.

<p>iframe</p> Signup and view all the answers

Os controlos do vídeo são adicionados como ______ no URL do vídeo.

<p>parâmetros</p> Signup and view all the answers

O elemento picture contém um ou mais elementos ___, cada um referindo-se a diferentes imagens.

<p>source</p> Signup and view all the answers

Cada elemento source tem um atributo ___ que define qual a imagem mais adequada.

<p>media</p> Signup and view all the answers

Para delimitar a área de display do vídeo, utilizamos os atributos ______ e height.

<p>width</p> Signup and view all the answers

O elemento img é usado pelos browsers que não suportam o elemento ___ ou se nenhuma das tags source corresponder.

<p>picture</p> Signup and view all the answers

Utilizar sempre o POST se os dados do formulário contiverem informações ______ ou pessoais!

<p>sensíveis</p> Signup and view all the answers

O elemento

<p>descrição</p> Signup and view all the answers

O atributo for deve ser igual ao atributo ______ do elemento <input> para associá-los.

<p>id</p> Signup and view all the answers

O elemento ?

<p>Os dados da lista não serão enviados ao servidor após a submissão.</p> Signup and view all the answers

Para criar um botão que não permite a inserção de texto e elementos, qual elemento deve ser utilizado?

<button type='button'> Signup and view all the answers

Qual atributo deve ser adicionado a um elemento

<p>selected</p> Signup and view all the answers

Qual elemento define uma lista desplegável em um formulário HTML?

<select> Signup and view all the answers

Para melhorar a acessibilidade, o atributo 'for' em um elemento

<p>id</p> Signup and view all the answers

Qual dos seguintes atributos de um elemento sejam enviados após a submissão do formulário?

<p>name</p> Signup and view all the answers

Qual é a função do atributo href em uma hiperligação?

<p>Indica o destino da hiperligação.</p> Signup and view all the answers

Qual é a consequência de não adicionar o atributo name a um elemento ?

<p>Para especificar quantas opções devem ser visíveis ao mesmo tempo.</p> Signup and view all the answers

O que o atributo 'autofocus' faz em um campo de entrada?

<p>Coloca o cursor automaticamente neste campo ao carregar a página</p> Signup and view all the answers

Qual é a aparência padrão de uma hiperligação não visitada nos navegadores?

<p>Sublinhada e de cor azul.</p> Signup and view all the answers

O que acontece quando você passa o rato sobre uma hiperligação?

<p>A seta do rato transforma-se em uma mão.</p> Signup and view all the answers

Qual desses tipos de input é adequado para o atributo 'required'?

<p>text</p> Signup and view all the answers

Qual das opções abaixo representa um link interno para a mesma página?

<p>href='#topo'</p> Signup and view all the answers

Qual atributo indica uma sugestão de valor esperado em um campo de entrada?

<p>placeholder</p> Signup and view all the answers

O que caracteriza uma hiperligação visitada?

<p>Sublinhada e de cor roxa.</p> Signup and view all the answers

Qual combinação é correta sobre os atributos e seus tipos de input?

<p>required - email</p> Signup and view all the answers

Quando é apropriado usar o atributo 'autocomplete'?

<p>Quando se deseja desativar o preenchimento automático</p> Signup and view all the answers

Qual descrita corretamente o uso do atributo 'size' em um campo de entrada?

<p>Especifica a largura visível em caracteres</p> Signup and view all the answers

Qual é a característica principal do atributo sandbox quando vazio?

<p>Aplica todas as restrições possíveis ao conteúdo.</p> Signup and view all the answers

Como o atributo title no iframe é relevante para a acessibilidade?

<p>Facilita a leitura do conteúdo para leitores de tela.</p> Signup and view all the answers

Qual das funções é desempenhada pelo sandbox quando aplicado a um iframe?

<p>Bloquear a execução automática de vídeos.</p> Signup and view all the answers

O que significa 'tratar o conteúdo como sendo de uma origem única' no contexto do sandbox?

<p>Impedir que o iframe se comunique com outros conteúdos fora do seu domínio.</p> Signup and view all the answers

Qual é uma das finalidades do uso de formulários HTML?

<p>Coletar dados do usuário para envio a um servidor.</p> Signup and view all the answers

Qual é o impacto da validação do lado do cliente nos formulários HTML?

<p>Melhora a experiência do usuário ao evitar envios incorretos.</p> Signup and view all the answers

Qual dos seguintes não é um resultado da aplicação do atributo sandbox em um iframe?

<p>Permitir que o conteúdo utilize APIs externas.</p> Signup and view all the answers

Para que serve o atributo src em um iframe?

<p>Definir a origem do arquivo para ser exibido no iframe.</p> Signup and view all the answers

Study Notes

  • Links são facilmente reconhecíveis porque o cursor muda para uma mão quando o rato passa sobre uma hiperligação.
  • Uma hiperligação não precisa ser texto, pode ser uma imagem ou outro elemento HTML.
  • O atributo href é o mais importante do elemento <a>, indicando o destino da hiperligação.
  • Hiperligações (links) normalmente aparecem desta forma em navegadores:
    • Uma ligação não visitada é sublinhada e azul.
    • Uma hiperligação visitada é sublinhada e roxa.
    • Uma ligação ativa é sublinhada e vermelha.
  • A página de destino é, geralmente, exibida na janela atual do navegador, exceto quando outro destino é especificado.
  • Caminho absoluto: href="https://www.…", referência a um documento na web alojado em um servidor diferente.
  • Caminho relativo: href="/caminho…", referência a um arquivo (imagem, HTML,…) no mesmo servidor do site.
  • ../: Aciona a pasta superior na estrutura de diretórios.

HTML - Formulários

  • Usado para coletar dados do usuário; os dados são enviados a um servidor para processamento.
  • Permite coletar dados de usuário usando diversos elementos(ex: texto, senha, etc.).
  • Estrutura elementos para entrada de dados.
  • Permite ações para apresentação de dados após envio de formulário.
  • Suporte para validação do lado do cliente.
  • Elementos HTML <form>:
    • label: Descreve HTML <form> elements .
    • input: Coletar dados de vários tipos.
    • button: Botão que dispara ações no formulário.
    • select: Cria listas dropdown.
    • textarea: Para textos longos.
    • fieldset: Agrupa elementos relacionados.
    • legend: Descreve fieldset.
    • datalist: Lista de opções pré-definidas.
    • output: Mostra cálculos e resultados.
    • option: Opções para listas dropdown.
    • optgroup: Agrupa opções em listas dropdown.

HTML - Atributos <form>

  • action: Ação executada quando o formulário é enviado. Normalmente, envio dos dados para um arquivo no servidor.
  • target: Local onde a resposta será exibida. _blank, _self, _parent, _top, ou um nome de iframe.
  • autocomplete: Habilitar ou desabilitar preenchimento automático de formulários.
  • novalidate: Desabilita validação dos dados do formulário.
  • method: Define qual o método HTTP ("get" ou "post").
    • GET: Anexa dados ao URL (não recomendado para dados sensíveis por causa da visibilidade).
    • POST: Envia dados no corpo do pedido HTTP. Mais seguro para dados confidenciais.

HTML - Elementos <form>

  • input: Vários tipos de entrada de dados (texto, senha, checkboxes, radios, etc.).
  • label: Para descrever elementos de entrada, facilitando a navegação para deficientes visuais.
  • select: Criar menus dropdown, permitindo selecionar apenas uma ou múltiplas opções. option define as opções.
  • optgroup: Agrupar opções em menus dropdown para melhor organização.

HTML - Elementos <iframe>

  • iframe: Define um "frame" interno para exibir outro documento HTML dentro da página.
  • src: Localização do documento a ser exibido no iframe.
  • sandbox: Restrições adicionais sobre o conteúdo do iframe. Previne acesso a recursos externos.

HTML - Elementos

  • <video>: Exibe vídeos na página web.
  • controls: Adiciona controles de reprodução ao vídeo (play, pause, volume).
  • src: Define o endereço do arquivo de vídeo.
  • width e height: Definir tamanho em píxeis.
  • type: Define o tipo de arquivo (ex., video/mp4).

HTML - Elementos

  • <audio>: Reproduz áudio.
  • controls: Controladores de áudio.
  • src e type: Especificam endereço do arquivo e seu tipo (ex. MP3).

HTML - Elementos

  • <picture>: Permite a exibição de imagens diferentes, dependendo do dispositivo ou do tamanho da tela do usuário.
  • <source>: Define diferentes versões de uma imagem para tamanhos de tela distintos.
  • <img>: Imagem principal, se nenhuma das tags <source> for compatível.

HTML - Elementos

  • <img>: Inclui imagens em uma página.
  • src: Endereço da imagem.
  • alt: Texto alternativo da imagem para usuários que não podem visualizá-la.
  • width e height: Definem as dimensões da imagem.

HTML - Elementos <form>

  • <datalist>: Fornece uma lista pré-definida de opções. Útil para preenchimento automático.
  • <fieldset>: Um contêiner que agrupa os elementos de um formulário, muitas vezes organizando-os em seções distintas.
  • <legend>: Uma legenda que descreve o fieldset.

HTML - Tipos de Input

  • <input type="text">: Campo de texto simples.
  • <input type="password">: Campo de senha; os caracteres são ocultos.
  • <input type="submit">: Botão para enviar o formulário.
  • <input type="reset">: Redefine todos os campos do formulário para seus valores padrão.
  • <input type="radio">: Botões de opção; apenas um pode ser selecionado.
  • <input type="checkbox">: Caixa de seleção; podem ser selecionadas várias opções.
  • <input type="color">: Seleciona uma cor.
  • <input type="date">: Seleciona uma data.
  • <input type="datetime-local">: Seleciona uma data e hora.
  • <input type="email">: Campo para endereços de email.
  • <input type="file">: Permite ao usuário selecionar um ou mais arquivos para upload.
  • <input type="image">: Imagem para usar como botão de submissão.
  • <input type="number">: Campo de número. Permite definir limites mínimo e máximo.
  • <input type="tel">: Campo para números de telefone.
  • <input type="time">: Campo para selecionar horário.
  • <input type="url">: Campo para URLs.
  • <input type="button">: Botão que executa uma ação. Não funciona como submit.
  • name: Identifica o elemento de input no formulário durante a submissão.
  • id: Id único para associar com label, importante para acessibilidade.

HTML - YouTube Vídeos

  • <iframe>: Serve para incorporar conteúdo de outros sites, incluindo vídeos do YouTube.
  • width e height: Especificam dimensões para adequação visual.
  • src: Endereço do vídeo do YouTube a ser incorporado. Parâmetros podem ser adicionados após src para controles (ex., autoplay, mute, controls).

Studying That Suits You

Use AI to generate personalized quizzes and flashcards to suit your learning preferences.

Quiz Team

Related Documents

HTML - Tecnologias Web_HTML PDF

Description

Neste quiz, você irá testar seus conhecimentos sobre links e formulários em HTML. Aprenda sobre a importância do atributo href e como funcionam as ligações em diferentes estados. Além disso, descubra como os formulários são usados para coletar dados dos usuários.

More Like This

ASP.NET Web Development Overview
12 questions
PHP Web Development Lecture 10
5 questions
Web Development Forms and HTTP Methods
16 questions
Use Quizgecko on...
Browser
Browser