Buscar

Para montarmos uma tela igual abaixo, como deveria estar o nosso código utilizando a ferramenta Flexbox? a container: { flex: 2, backgroundColor:...

Para montarmos uma tela igual abaixo, como deveria estar o nosso código utilizando a ferramenta Flexbox?


a container: {
flex: 2,
backgroundColor: 'green',
},
container2: {
flex: 1,
backgroundColor: 'red',
},
container3: {
flex: 1,
backgroundColor: 'blue',
},
container4: {
flex: 2,
backgroundColor: 'black',
},
b container: {
flex: 3,
backgroundColor: 'green',
},
container2: {
flex: 1,
backgroundColor: 'red',
},
container3: {
flex: 1,
backgroundColor: 'blue',
},
container4: {
flex: 2,
backgroundColor: 'black',
},
c container: {
flex: 3,
backgroundColor: 'green',
},
container2: {
flex: 2,
backgroundColor: 'red',
},
container3: {
flex: 2,
backgroundColor: 'blue',
},
container4: {
flex: 2,
backgroundColor: 'black',
},
d container: {
flex: 1,
backgroundColor: 'green',
},
container2: {
flex: 1,
backgroundColor: 'red',
},
container3: {
flex: 1,
backgroundColor: 'blue',
},
container4: {
flex: 2,
backgroundColor: 'black',
},
e container: {
flex: 1,
backgroundColor: 'green',
},
container2: {
flex: 1,
backgroundColor: 'red',
},
container3: {
flex: 1,
backgroundColor: 'blue',
},
container4: {
flex: 3,
backgroundColor: 'black',
},

Essa pergunta também está no material:

Prova Mobile
2 pág.

Programação para Dispositivos Móveis SENAC EADSENAC EAD

💡 1 Resposta

User badge image

Ed Verified user icon

A alternativa correta seria a letra C, com o seguinte código: ``` container: { display: 'flex', flexDirection: 'column', flexWrap: 'wrap', height: '100vh', }, container1: { flex: 2, backgroundColor: 'green', }, container2: { flex: 1, backgroundColor: 'red', }, container3: { flex: 1, backgroundColor: 'blue', }, container4: { flex: 2, backgroundColor: 'black', }, ``` Nesse código, estamos definindo um container com display flex e flex-direction column, para que os elementos filhos sejam organizados em colunas. O flex-wrap wrap permite que os elementos sejam quebrados em linhas quando não couberem mais na coluna atual. A altura do container é definida como 100vh para ocupar toda a altura da tela. Em seguida, definimos os estilos para cada um dos containers filhos, utilizando a propriedade flex para definir a proporção de espaço que cada um deve ocupar.

0
Dislike0

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis


✏️ Responder

SetasNegritoItálicoSublinhadoTachadoCitaçãoCódigoLista numeradaLista com marcadoresSubscritoSobrescritoDiminuir recuoAumentar recuoCor da fonteCor de fundoAlinhamentoLimparInserir linkImagemFórmula

Para escrever sua resposta aqui, entre ou crie uma conta.

User badge image

Perguntas relacionadas

Materiais relacionados

Materiais recentes

Perguntas Recentes