Para montarmos uma tela igual abaixo, como deveria estar o nosso código utilizando a ferramenta Flexbox? a container: { flex: 2, backgroundColor:...
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:
💡 1 Resposta
Ed 
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.
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
Para escrever sua resposta aqui, entre ou crie uma conta
Outros materiais
Perguntas relacionadas
Materiais relacionados
Compartilhar