Buscar

Para montarmos uma tela igual abaixo, como deveria estar o nosso código utilizando a ferramenta Flexbox? Contextualização para acessibilidade: ess...

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

Contextualização para acessibilidade: essa imagem exibe um aplicativo de celular com o primeiro bloco ocupando a maior parte da tela, dois blocos em vermelho e azul ocupando o mesmo tamanho e, por último, um bloco em preto ocupando um espaço maior que o bloco azul e menor que o bloco verde.
a container: { flex: 1, 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: 2, backgroundColor: 'red', }, container3: { flex: 2, backgroundColor: 'blue', }, container4: { flex: 2, backgroundColor: 'black', },
c container: { flex: 1, backgroundColor: 'green', }, container2: { flex: 1, backgroundColor: 'red', }, container3: { flex: 1, backgroundColor: 'blue', }, container4: { flex: 2, backgroundColor: 'black', },
d container: { flex: 3, backgroundColor: 'green', }, container2: { flex: 1, backgroundColor: 'red', }, container3: { flex: 1, backgroundColor: 'blue', }, container4: { flex: 2, backgroundColor: 'black', },
e container: { flex: 2, backgroundColor: 'green', }, container2: { flex: 1, backgroundColor: 'red', }, container3: { flex: 1, backgroundColor: 'blue', }, container4: { flex: 2, backgroundColor: 'black', },

Essa pergunta também está no material:

Prova Programação para dispositivos móveis Senac
5 pág.

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

💡 1 Resposta

User badge image

Ed Verified user icon

Para montar uma tela com a estrutura descrita, utilizando a ferramenta Flexbox, a opção correta seria a alternativa B: ```jsx container: { flex: 3, backgroundColor: 'green' }, container2: { flex: 2, backgroundColor: 'red' }, container3: { flex: 2, backgroundColor: 'blue' }, container4: { flex: 2, backgroundColor: 'black' } ``` Essa configuração atribui diferentes valores de flexibilidade aos containers, permitindo que eles se ajustem e ocupem o espaço disponível de acordo com as proporções definidas.

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

Outros materiais