Тёмный

Criando uma Página de Erro 404 com Tailwind CSS 

Web Online Desenvolve
Подписаться 7 тыс.
Просмотров 62
50% 1

#tailwindcss #tailwind #error #frontend #css3 #html5 #visualstudiocode
✨ Compre na Amazon:
amzn.to/3UgqOhL
Neste vídeo, vou te ensinar passo a passo como criar uma página de erro 404 personalizada utilizando a biblioteca Tailwind CSS. A página de erro 404 é essencial para qualquer site, pois fornece uma experiência amigável para os usuários quando uma página não é encontrada.
Durante o tutorial, vamos criar uma página de erro 404 limpa e moderna, com a ajuda do Tailwind CSS, uma biblioteca de utilitários CSS altamente personalizável. Você aprenderá a estruturar o HTML, estilizar os elementos com as classes do Tailwind e adicionar funcionalidades básicas, como um campo de busca e links de navegação.
Se você é um desenvolvedor web iniciante ou está procurando aprimorar suas habilidades de design de interface, este vídeo é para você! Ao final do tutorial, você terá uma página de erro 404 totalmente funcional e estilizada, pronta para ser implementada em seus próprios projetos.
Não se esqueça de deixar um like se este vídeo for útil para você, e inscreva-se no canal para mais tutoriais de desenvolvimento web com Tailwind CSS. Obrigado por assistir!
Saiba mais:
Você pode obter o link para a biblioteca Tailwind CSS diretamente no site oficial do Tailwind CSS ou através de um CDN (Content Delivery Network). Aqui estão os links para ambos os métodos:
Site Oficial do Tailwind CSS:
Visite o site oficial do Tailwind CSS em tailwindcss.com.
Na página inicial, vá até a seção de documentação ou clique no botão "Get Started".
Na página de instalação, você encontrará instruções para instalar o Tailwind CSS usando npm, yarn ou um CDN. Você pode copiar o link do CDN a partir dessas instruções.
CDN (Content Delivery Network):
Se preferir usar um CDN, você pode encontrar o link para a biblioteca Tailwind CSS no jsDelivr.
Pesquise por "tailwindcss" na barra de pesquisa.
Selecione a versão que deseja usar e copie o link do CDN fornecido.
O link utilizado no vídeo foi: cdn.jsdelivr.net/npm/tailwind...
📌 / webonlinedesenvolve
📌github.com/WebOnlineDesenvolve
🎵 Música: Back to the future - Ofshane
🎬 app.clipchamp.com
✨IDE: ( Integrated Development Environment )Microsoft Visual Studio.
✨IDE: ( Integrated Development Environment ) Visual Studio Code.
Extensões Visual Studo Code:
Tailwind CSS IntelliSense - Desenvolvimento do Tailwind (preenchimento automático)
Live Server: Carrega a página automaticamente.
Beautify : Padroniza a formatação do código
Color Highlight : Mostra as cores que você está criando no arquivo CSS.
IntelliSense forCSS: Fornece o auto completo da classe que você escreveu no seu código.
✨Tema do VS Code: Escuro+ (Escuro padrão)
✨Software Editor de videos: Shotcut.
✨Software para gravar a tela do computador: OBS Studio.
Google Fontes:
fonts.google.com/
⭐ Biblioteca JavaScript
cdnjs.cloudflare.com/ajax/lib...
Fontes de ícones
🔎fontawesome.com/v5.15/icons?d...
🔎fontawesome.com/
Ambiente de Desenvolvimento:
codepen.io
HTML E CSS:
🔎www.w3schools.com/default.asp
Site de verificação de erro:
🔎validator.w3.org/
Tabelas de cores:
🔎www.flextool.com.br/tabela_co...
Imagem para baixar:
🔎pixabay.com/pt/
Site para criar Thumbnails:
🔎www.canva.com/

Опубликовано:

 

5 май 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии    
Далее
Tailwind CSS Crash Course
30:31
Просмотров 634 тыс.
РУБИН - ЗЕНИТ: ВСЕ ГОЛЫ
01:03
Просмотров 190 тыс.
Kettim gul opkegani😋
00:37
Просмотров 1,3 млн
Create Crazy 3D Image Slider Effects Using CSS Only
14:07
Top 10 CSS One Liners That Will Blow Your Mind
13:34
Просмотров 929 тыс.
Brutally honest advice for new .NET Web Developers
7:19
Learn CSS Grid - A 13 Minute Deep Dive
13:35
Просмотров 507 тыс.
HTML + CSS NA PRÁTICA 🔥 Faça seu primeiro site
16:19
True parallax with CSS-only is now possible
17:32
Просмотров 226 тыс.
Override and mock network responses #DevToolsTips
7:50