Nesse post posto os links que CNDs para colocarmos em nossa página e sermos capazes de usar Bootstrap sem precisar baixá-lo.
Você deve está se perguntando o que é esse tal de Links CDNs. A resposta é bem simples: links CDNs são links de internet que permitem o acesso rápido a conteúdos, como imagens, vídeos e arquivos, através de servidores localizados em diferentes regiões geográficas, garantindo uma experiência mais rápida e eficiente para o usuário.
Em um cenário sem CDN, para usar uma biblioteca, framework ou outro recurso qualquer, temos que baixar da internet e armazenar dentro do nosso servidor e depois apontar a pasta que ele está em nossa página do site. Muita coisa a se fazer, não é?
Com o Link CDN, a única coisa que precisamos fazer é colocar o link dentro da nossa página e estaremos aptos a usar o recurso do link.
Dica: veja outros posts sobre Bootstrap clicando aqui.
Links para Bootstrap
Eu prefiro usar links para ter os recursos em meu pc. Para o Bootstrap não é diferente. Para usá-lo basta colocar esses links entre as tags <head> e </head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
Se quiser usar JQuery use esse link também:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
Exemplo completo
Veja abaixo um exemplo mais completo de links dentro de uma página HTML.
<!DOCTYPE html> <html lang="pt-BR"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Exemplo</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script> </head> <body> </body> </html>
Perceba o quanto é fácil usar links CDNs para Bootstrap ao invés de ter que baixar o próprio Bootstrap para seu computador.
Bonus: Links CDNs de acordo com a versão do Bootstrap
Aqui vai uma lista de links CDNs de acordo com a versão do Bootstrap. Nesse momento em que digito, a versão atual é a 5.
Versão 5 para Bootstrap, CSS, JavaScript e JavaScript Bundle
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
Versão 4 para Bootstrap, CSS, JavaScript e JavaScript Bundle
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
Fonte: bootstrapcdn
Comments on “Links CDNs para Bootstrap”