Instalação do Bootstrap via CDN
Ao trabalhar em um projeto com HTML, CSS e JS puro, é possível utilizar um CDN para incluir os arquivos CSS e JavaScript do Bootstrap diretamente no documento HTML, sem a necessidade de baixá-los para a máquina local.
Veja como incluir o Bootstrap via CDN no arquivo HTML:
<!-- Include Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Include Bootstrap JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
Diferença de Comportamento
Nos exemplos abaixo, será demonstrada a diferença entre os estilos padrão do navegador e os estilos aplicados com o Bootstrap. Neste momento, não será abordado o uso do Bootstrap.
Estilos Padrão do Navegador
index.html
Estilos Aplicados com Bootstrap
index.html
Explicação
Ambos os exemplos apresentam um elemento button com as classes btn e btn-primary. A aparência é obtida exclusivamente pela aplicação dessas duas classes fornecidas pelo Bootstrap, sem a necessidade de estilização adicional em CSS.
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Can you show me examples of the button with and without Bootstrap?
What are the main visual differences between the default and Bootstrap-styled buttons?
Can you explain what the `btn` and `btn-primary` classes do in Bootstrap?
Awesome!
Completion rate improved to 3.23Instalação do Bootstrap via CDN
Deslize para mostrar o menu
Ao trabalhar em um projeto com HTML, CSS e JS puro, é possível utilizar um CDN para incluir os arquivos CSS e JavaScript do Bootstrap diretamente no documento HTML, sem a necessidade de baixá-los para a máquina local.
Veja como incluir o Bootstrap via CDN no arquivo HTML:
<!-- Include Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Include Bootstrap JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
Diferença de Comportamento
Nos exemplos abaixo, será demonstrada a diferença entre os estilos padrão do navegador e os estilos aplicados com o Bootstrap. Neste momento, não será abordado o uso do Bootstrap.
Estilos Padrão do Navegador
index.html
Estilos Aplicados com Bootstrap
index.html
Explicação
Ambos os exemplos apresentam um elemento button com as classes btn e btn-primary. A aparência é obtida exclusivamente pela aplicação dessas duas classes fornecidas pelo Bootstrap, sem a necessidade de estilização adicional em CSS.
Obrigado pelo seu feedback!
