Conteneur du formulaire

Fait partie de la section Style avec CSS du Journey HTML de Coddy. Leçon 51 sur 76.

Défi

Facile

Dans cette leçon, nous allons rendre le formulaire plus structuré et visuellement attrayant.

Suivez les étapes ci-dessous :

Appliquez des styles au conteneur du formulaire pour le mettre en évidence. Écrivez une règle CSS qui cible l’élément ayant la classe login-form.
1. Définissez une couleur d’arrière-plan (blanche ou toute autre couleur qui convient).
2. Ajoutez du remplissage intérieur afin que le contenu dispose d’espace à l’intérieur.
3. Arrondissez les coins.
4. Appliquez une ombre portée pour créer un léger effet de flottement.
5. Ajoutez une bordure autour du formulaire (choisissez la couleur et l’épaisseur de votre choix).
Centrez le texte à l’intérieur du formulaire à l’aide de la propriété text-align .

Essayez vous-même

<html>
<head>
    <title>Login Form</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <form class="login-form">
        <h2>Login</h2>
        <input type="text" placeholder="Username">
        <input type="password" placeholder="Password">
        <button type="submit">Login</button>
    </form>
</body>
</html>