Como adicionar ícones de bootstrap em html e css
Como adicionar ícones de bootstrap em html e css
Os ícones de bootstrap podem ser adicionados em HTML e CSS usando o link CDN de bootstrap-icons. Esta seção descreverá os dois métodos para adicionar ícones de bootstrap em HTML e CSS.
Como adicionar ícones de bootstrap usando o link CDN
O link CDN (rede de entrega/distribuição de conteúdo) permite adicionar o CSS, JS e JQuery Libraries com muita facilidade. Dadding o link CDN de bootstrap-icons, você não precisa baixar e integrar os ícones de bootstrap com html. As próximas etapas levarão você a adicionar links de CDN seguidos de adição de ícones de bootstrap.
Etapa 1: Adicione o link CDN dos ícones de bootstrap
Bootstrap5 é a versão mais recente do bootstrap, para adicionar o link CDN de bootstrap-icons, copie/cole o seguinte link na tag.
Etapa 2: Adicionando ícones de bootstrap
Para adicionar ícones de bootstrap, você deve usar a seguinte sintaxe.
Na sintaxe acima, a Bi-ClassName Representa o nome de classe dos ícones como Bi-Search, Bi-Calendário, Bi-Facebook, etc.,
Exemplo
Este exemplo usa a classe de ícones de bootstrap para imprimir o ícone do LinkedIn e Thumbs-up.
LinkedIn-icon:
Polegar-se-icon:
São criados dois parágrafos que imprime o ícone do LinkedIn e o iCon up usando BI-LINKEDIN e BILHATHS-ATHUMBS-UP preencher classes de bootstrap-icons.
Saída
A saída mostra que o ícone do LinkedIn e o iCon polegar-se foi integrado ao documento HTML.
Conclusão
Os ícones de bootstrap podem ser adicionados ao HTML e CSS usando o link CDN de ícones padrão. O suporte de ícones padrão é fornecido pelo próprio bootstrap e você deve adicionar o link CDN de ícones de bootstrap no seu documento HTML. Este post descritivo que permitirá que você adicione ícones de bootstrap em HTML e CSS. Além disso, você também aprenderia a configurar um ambiente de bootstrap-icons com HTML e CSS.