Prova final e projeto de Tailwind CSS

1. Prova final

0 de 12 questões respondidas

1. 1. O que caracteriza o CSS utilitário do Tailwind?

   Uma classe por componenteClasses pequenas de propósito único combinadas no HTMLEstilos inline gerados em runtimeUm pré-processador como Sass

2. 2. Como aplicar um estilo só a partir de telas médias?

   md:flexflex-md@md flexmedia-md:flex

3. 3. Para que serve o prefixo hover:?

   Aplicar o estilo quando o mouse está sobre o elementoAplicar no focoAplicar sempreAplicar na impressão

4. 4. Onde ficam as cores e fontes personalizadas do projeto?

   Espalhadas nos componentesEm tokens do tema, usados depois pelas classesEm um arquivo JSON externoNo HTML da página

5. 5. Qual utilitário centraliza itens nos dois eixos em um flex?

   items-center justify-centertext-centerplace-self-centeralign-middle

6. 6. gap-4 faz o quê?

   Adiciona margem externaAdiciona espaçamento entre filhos de flex/gridAdiciona padding internoAdiciona borda

7. 7. Quando usar um valor arbitrário como w-[37px]?

   Sempre que possívelSó quando a escala do tema não cobre o casoNuncaSomente em mobile

8. 8. Como aplicar estilos no modo escuro?

   dark:bg-slate-900night:bg-slate-900theme-dark@dark

9. 9. Para reaproveitar um conjunto de classes que se repete, o melhor é:

   Copiar e colar em cada lugarExtrair um componente reutilizávelUsar !importantEscrever CSS global

10. 10. truncate serve para:

    Cortar o texto em uma linha com reticênciasReduzir a fonteQuebrar palavras longasEsconder o elemento

11. 11. Qual é o primeiro passo ao trabalhar com Utility-first na prática?

    Copiar uma solução inteiraDefinir o objetivo e a evidência esperadaIgnorar a entradaAlterar tudo de uma vez

12. 12. O que box-sizing: border-box faz?

    Adiciona borda a tudoFaz padding e borda entrarem na largura declaradaRemove a margemCentraliza o elemento

2. Projeto final