HTML5 - Português Flashcards

1
Q

Quem criou o HTML?

A

Tim Berners-Lee

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Quais is elementos da estrutura base do HTML5?

A

1) <!DOCTYPE html> informa que usa html

2) <html> tag root

3) <head> metadados, informações que são passadas para o browser sobre a nossa página

3.1) <title> aparece na aba do browser. Fica dentro do head</title>

5) <body> todo o conteúdo da página

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Como se organizam os elementos da estrutura base do HTML5?

A

<!DOCTYPE html>

<html>

<head>

<title>
</title>

</head>

<body>

</body>

</html>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Tag de títulos

A

<h1>
<h2>
<h3>
<h4>
<h5>
</h5></h4></h3></h2></h1>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Tag de parágrafo

A

<p>
</p>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Tag que coloca uma linha divisória na página

A

<hr></hr>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Tag que Deixa o texto em negrito

A

<strong> ou <b></b></strong>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Tag que

A
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Tag que risca a palavra no meio

A

<s>
</s>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Tipos de listas no HTML

A

Ordenadas: 1, 2, 3 ….

Não ordenadas: não tem ordem

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Tag para listas não ordenadas

A

<ul>
</ul>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Tag para criar listas ordenadas

A

<ol>
</ol>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Tag para os elementos filhos de listas ordenadas e não ordenadas

A

<li>
</li>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

tag que dá um espaço entre linhas

A

<br></br>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

O que significa o termo refatorar?

A

refazer partes do código

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

O que significa o termo identar?

A

organizar as hierarquias de colunas

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Atalho CTRL+D, faz o que?

A

Selecionando uma palavra e apertando CTRL+D vc consegue selecionar todas as palavras iguais àquela

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Quais são as duas principais tags para blocos de códigos?

A

<div> e <span>
</span></div>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

O que faz a tag <div>?

A

Organiza um bloco de códigos
colocar ela em volta de blocos de códigos

sempre começa em uma nova linha e pega o máximo da tela que puder

20
Q

O que faz a tag <span>?</span>

A

Organiza um bloco menor de código
não começa em uma nova linha e pega um espaço menor

21
Q

Atributos html, o que são?

A

são palavras especiais usadas dentro da tag de abertura para controlar o comportamento do elemento. Os atributos HTML são um modificador de um tipo de elemento HTML. <tag name=’’valor’’></tag>

22
Q

tag e atributo para incluir um link

A

____<a href=´´link´´> Texo que vc quer que apareça </a>.____
Se a <a>tag não tiver nenhum hrefatributo, ela será apenas um espaço reservado para um hiperlink.</a>

23
Q

Qual é a tag usada para incorporar uma imagem em uma página HTML?

A

A <img></img>tag cria um espaço de retenção para a imagem referenciada. A <img></img>tag tem dois atributos obrigatórios:

src - Especifica o caminho para a imagem
alt - Especifica um texto alternativo para a imagem, se a imagem por algum motivo não puder ser exibida.

<img src=´´img/example.png´´> </img>

24
Q

Dica: Para vincular uma imagem a outro documento, simplesmente aninhe a <img></img>tag dentro de uma tag <a> (veja o exemplo abaixo).</a>

A
25
Q

Atributo que ao clicar no link, ele abre em uma nova página.

A

target=’’_blank’’

26
Q

Estrutura básica geral de uma tabela

A

<table>

<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<<thead>

<tbody>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</tbody>

</table>
</thead></thead></table>

27
Q

Explicação da Estrutura básica geral de uma tabela

A

thead e tbody são tags semânticas que servem apenas para organização.
o tr introduz uma nova linha na tabela, o th ou td introduz o elemento das colunas dessa linha

para a tabela ter borda, é necessário incluir o parâmetro border=”1”

28
Q

Para o título ficar logo acima da tabela, sem nenhum espaço entre eles, usa-se <caption> enquadrando a tag de títulos <h></h>

A
29
Q

Estrutura de um forms no HTML

A

<form>
<label>First name:</label>
<input></input><br></br><br></br>
<label>Last name:</label>
<input></input><br></br><br></br>
<input></input>
</form>

30
Q

action= {destino do forms}

A
31
Q

<input></input>

A

A <input></input>tag especifica um campo de entrada onde o usuário pode inserir dados.

32
Q

<label></label>

A

Sempre use a tag <label> para definir rótulos para <input></input></label>

33
Q

Os diferentes tipos de entrada (<input></input>) são os seguintes:

A

<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>
<input></input>(valor padrão)
<input></input>
<input></input>
<input></input>

34
Q

Atributo autocomplete

A
35
Q

Tag para criar uma lista de seleção suspensa

A

<select id=”cars”name=”cars”>

<option>Volvo</option>

<option>Saab</option>

<option>Fiat</option>

<option>Audi</option>

</select>

36
Q

Tag que é usada para mostrar um vídeo em uma página da web.

A

<video>
<source></source>
<source></source>
Your browser does not support the video tag.
</video>

37
Q

Descrição tags de vídeo

A

O controls atributo adiciona controles de vídeo, como reproduzir, pausar e volume.

É uma boa ideia sempre incluir atributos height e width. Se a altura e a largura não estiverem definidas, a página poderá piscar enquanto o vídeo é carregado

O <source></source>elemento permite que você especifique arquivos de vídeo alternativos que o navegador pode escolher. O navegador usará o primeiro formato reconhecido.

O texto entre as tags <video>e </video>só será exibido em navegadores que não suportam o <video>elemento.</video>

Para iniciar um vídeo automaticamente, use o autoplayatributo: <video>...</video>

Adicione muted depois autoplay para permitir que seu vídeo comece a ser reproduzido automaticamente (mas sem som):

38
Q

O elemento HTML <audio></audio>

A

é usado para reproduzir um arquivo de áudio em uma página da web.

<audio>
<source></source>
<source></source>
Your browser does not support the audio element.
</audio>

O controlsatributo adiciona controles de áudio, como reproduzir, pausar e volume.

O <source></source>elemento permite que você especifique arquivos de áudio alternativos que o navegador pode escolher. O navegador usará o primeiro formato reconhecido.

O texto entre as tags <audio>e </audio>só será exibido em navegadores que não suportam o <audio>elemento.</audio>

39
Q

O que são elementos semânticos?

A

O que são elementos semânticos?
Um elemento semântico descreve claramente seu significado tanto para o navegador quanto para o desenvolvedor.

Exemplos de elementos não semânticos : <div>e <span>- Não diz nada sobre o seu conteúdo.</span>

Exemplos de elementos semânticos : <form>, <table>, e <article>- Define claramente seu conteúdo.

Em HTML existem alguns elementos semânticos que podem ser usados ​​para definir diferentes partes de uma página web:

40
Q

Semântica: <section>

A

O <section>elemento define uma seção em um documento.

De acordo com a documentação HTML do W3C: “Uma seção é um agrupamento temático de conteúdo, normalmente com um título.”

Exemplos de onde um <section>elemento pode ser usado:

Capítulos
Introdução
Novos itens
Informações de contato

41
Q

Semântica: <article>

A

O <article>elemento especifica conteúdo independente e independente.

Um artigo deve fazer sentido por si só e deve ser possível distribuí-lo independentemente do resto do site.

Exemplos de onde o <article>elemento pode ser usado:

Postagens no fórum
Postagens no blog
Comentários do usuário
Cartões de produto
Artigos de jornal

42
Q

Semântica: <header>

A

O <header>elemento representa um contêiner para conteúdo introdutório ou um conjunto de links de navegação.

43
Q

Semântica: <header>

A

Elemento HTML <cabeçalho>
O <header>elemento representa um contêiner para conteúdo introdutório ou um conjunto de links de navegação.</cabeçalho>

Um <header>elemento normalmente contém:

um ou mais elementos de título (<h1> - <h6>)
logotipo ou ícone
informações de autoria
Nota: Você pode ter vários <header>elementos em um documento HTML. No entanto, <header>não pode ser colocado dentro de um <footer>ou <address>outro <header>elemento.

44
Q

Semântica: <footer>

A

O <footer>elemento define um rodapé para um documento ou seção.

Um <footer>elemento normalmente contém:

informações de autoria
Informações sobre direitos autorais
informações de contato
Mapa do site
voltar ao topo links
documentos relacionados
Você pode ter vários <footer>elementos em um documento.

45
Q

Semântica: <nav>

A

O <nav>elemento define um conjunto de links de navegação.

Observe que NEM todos os links de um documento devem estar dentro de um <nav>elemento. O <nav>elemento destina-se apenas a grandes blocos de links de navegação.

Navegadores, como leitores de tela para usuários com deficiência, podem usar esse elemento para determinar se devem omitir a renderização inicial desse conteúdo.

46
Q

Semântica: <aside>

A

O <aside>elemento define algum conteúdo além daquele em que está colocado (como uma barra lateral).

O <aside>conteúdo deve estar indiretamente relacionado ao conteúdo circundante.

47
Q
A