Aula 5 e 6 - Inserindo o efeito no cartão

Para que os nossos cartões funcionem como flashcards de estudo, precisamos que o texto da resposta esteja oculto na frente do cartão. Ele deve aparecer somente quando o cartão for virado. Pensando nisso, escolha a alternativa que apresenta corretamente o código que esconde o conteúdo adicionado na classe cartao__conteudo__resposta.

• .cartao__conteudo__resposta { backface-visibility: hidden; }

• .cartao__conteudo__resposta { backface: hidden; }

• .cartao__conteudo__resposta { backface-visibility: visible; }

• #cartao__conteudo__resposta { backface-visibility: hidden; }

Complete a frase: Para esconder o texto da resposta na frente do cartão, devemos usar a propriedade CSS ______ com o valor 'hidden'.

• a) backface-visibility

• b) visibility

• c) display

• d) opacity

O que pretende-se alcançar ao girar os cartões?

• Giro vertical

• Giro horizontal

• Giro diagonal

• Nenhum giro.

Complete a sequência correta de blocos para adicionar uma rotação horizontal nos cartões: ________ .cartao_conteudo { rotateX(180deg); }

• A) transform:

• B) rotateY(90deg);

• C) scale(1.5);

• D) translateX(50px);

O que Pedro deseja ajustar em seu projeto?

• Cor do texto

• Margem inferior

• Tamanho da fonte

• Largura do cartão

Complete a sequência correta de blocos para adicionar uma margem inferior na tag de parágrafo: p { ________ 4rem; } .cartao__conteudo.

• A) padding:

• B) margin-bottom:

• C) border:

• D) font-size:

Pedro está desenvolvendo o seu projeto e percebeu que, sempre que adiciona um novo cartão, ele aparece na mesma linha do anterior e o espaço inferior da página nunca é utilizado. Além disso, os cartões estão muito próximos uns aos outros, dificultando a navegação na página. Pensando nisso, ordene todos os blocos abaixo que adicionam a propriedade necessária para fazer uma quebra de linha nos cartões e incluir um espaçamento de 3rem entre cada cartão. wrap; gap: flex-wrap: 3rem;} #container {

• wrap; gap: flex-wrap: 3rem;} #container {

• flex-wrap: wrap; gap: 3rem;

• display: flex; flex-direction: column;

• margin-bottom: 3rem;

Qual é a sequência correta para criar a estrutura em JavaScript que Ana utilizará nos cartões?

• 'nome do país', 'nome da capital', 'ponto turístico'

• 'nome da capital', 'ponto turístico', 'nome do país'

• 'ponto turístico', 'nome do país', 'nome da capital'

• 'nome do país', 'ponto turístico', 'nome da capital'

Qual dos seguintes elementos não é necessário para criar a estrutura do cartão?

• 'nome do país'

• 'nome da capital'

• 'ponto turístico'

• 'população'

Qual é o propósito da função criarCartao() no projeto de Ana?

• Criar cartões com informações sobre países

• Calcular a população de um país

• Traduzir o idioma de um país

• Converter a moeda de um país