Desafio e Quiz: Configurar o Bootstrap
Nota
Todos os desafios seguirão o mesmo formato apresentado abaixo:
- Será apresentada a tarefa que precisa ser concluída;
- Em seguida, haverá um bloco de código onde devem ser feitas alterações conforme a tarefa;
- Clique no botão Executar Código para visualizar a página ao vivo;
- Abaixo do bloco de código, estarão disponíveis dois botões: Dica e Solução;
- O botão Dica fornece orientações para a tarefa;
- O botão Solução revela a solução correta.
- Recomenda-se tentar resolver a tarefa por conta própria antes de recorrer ao botão Solução.
Tarefa
Foi fornecido um código HTML básico com um elemento button, atualmente estilizado com os estilos padrão do navegador. Embora o elemento button inclua nomes de classes provenientes do Bootstrap, nenhuma alteração é visível na página ao vivo porque o Bootstrap ainda não foi integrado ao projeto. Sua tarefa é adicionar os links apropriados para conectar o Bootstrap ao projeto.
index.html
- Para adicionar o link do CSS do Bootstrap, utilize o seguinte código:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">. - Para o link do JavaScript do Bootstrap, utilize este código:
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>.
index.html
Quiz
1. Qual é um dos métodos para integrar o Bootstrap em um projeto?
2. O que significa CDN no contexto da integração do Bootstrap?
3. Qual comando é utilizado para instalar o Bootstrap via NPM?
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Awesome!
Completion rate improved to 3.23Desafio e Quiz: Configurar o Bootstrap
Deslize para mostrar o menu
Nota
Todos os desafios seguirão o mesmo formato apresentado abaixo:
- Será apresentada a tarefa que precisa ser concluída;
- Em seguida, haverá um bloco de código onde devem ser feitas alterações conforme a tarefa;
- Clique no botão Executar Código para visualizar a página ao vivo;
- Abaixo do bloco de código, estarão disponíveis dois botões: Dica e Solução;
- O botão Dica fornece orientações para a tarefa;
- O botão Solução revela a solução correta.
- Recomenda-se tentar resolver a tarefa por conta própria antes de recorrer ao botão Solução.
Tarefa
Foi fornecido um código HTML básico com um elemento button, atualmente estilizado com os estilos padrão do navegador. Embora o elemento button inclua nomes de classes provenientes do Bootstrap, nenhuma alteração é visível na página ao vivo porque o Bootstrap ainda não foi integrado ao projeto. Sua tarefa é adicionar os links apropriados para conectar o Bootstrap ao projeto.
index.html
- Para adicionar o link do CSS do Bootstrap, utilize o seguinte código:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">. - Para o link do JavaScript do Bootstrap, utilize este código:
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>.
index.html
Quiz
1. Qual é um dos métodos para integrar o Bootstrap em um projeto?
2. O que significa CDN no contexto da integração do Bootstrap?
3. Qual comando é utilizado para instalar o Bootstrap via NPM?
Obrigado pelo seu feedback!
