Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Défi : Cartes | Construction de Composants de Base
Tailwind CSS pour le Développement Web

bookDéfi : Cartes

Tâche

En utilisant Tailwind CSS, créez un composant de carte avec les exigences suivantes :

  1. La carte doit avoir :
    • Une largeur maximale de md ;
    • Des coins arrondis ;
    • Une couleur de fond.
  2. La carte doit contenir :
    • Une image qui occupe toute la largeur de la carte ;
    • Un titre avec un texte en gras et une grande taille de police ;
    • Un paragraphe avec une taille de police de base et un style italique.
  3. Ajoutez des badges à la carte avec :
    • Des coins arrondis et une petite taille de police.
index.html

index.html

copy
  • Utilisez max-w-md pour définir la largeur maximale de la carte ;
  • Utilisez rounded pour ajouter des coins arrondis à la carte ;
  • Utilisez bg-purple-100 pour définir la couleur de fond de la carte ;
  • Utilisez w-full pour que l'image occupe toute la largeur de la carte ;
  • Utilisez font-bold pour appliquer un style gras au texte ;
  • Utilisez text-xl pour définir une taille de police plus grande pour le titre ;
  • Utilisez text-base pour définir la taille de police de base pour le texte du paragraphe ;
  • Utilisez italic pour appliquer un style italique au texte ;
  • Utilisez rounded-full pour ajouter des coins arrondis aux badges ;
  • Utilisez text-sm pour définir la petite taille de police pour les badges.
index.html

index.html

copy

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 3. Chapitre 4

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Awesome!

Completion rate improved to 3.57

bookDéfi : Cartes

Glissez pour afficher le menu

Tâche

En utilisant Tailwind CSS, créez un composant de carte avec les exigences suivantes :

  1. La carte doit avoir :
    • Une largeur maximale de md ;
    • Des coins arrondis ;
    • Une couleur de fond.
  2. La carte doit contenir :
    • Une image qui occupe toute la largeur de la carte ;
    • Un titre avec un texte en gras et une grande taille de police ;
    • Un paragraphe avec une taille de police de base et un style italique.
  3. Ajoutez des badges à la carte avec :
    • Des coins arrondis et une petite taille de police.
index.html

index.html

copy
  • Utilisez max-w-md pour définir la largeur maximale de la carte ;
  • Utilisez rounded pour ajouter des coins arrondis à la carte ;
  • Utilisez bg-purple-100 pour définir la couleur de fond de la carte ;
  • Utilisez w-full pour que l'image occupe toute la largeur de la carte ;
  • Utilisez font-bold pour appliquer un style gras au texte ;
  • Utilisez text-xl pour définir une taille de police plus grande pour le titre ;
  • Utilisez text-base pour définir la taille de police de base pour le texte du paragraphe ;
  • Utilisez italic pour appliquer un style italique au texte ;
  • Utilisez rounded-full pour ajouter des coins arrondis aux badges ;
  • Utilisez text-sm pour définir la petite taille de police pour les badges.
index.html

index.html

copy

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 3. Chapitre 4
some-alt