Girdi

Coddy'nin HTML Journey'sinin CSS ile Stil Verme bölümünün bir parçası. Ders 52 / 76.

Görev

Kolay

Bu derste, kullanıcı dostu olmaları için giriş alanlarının görünümünü iyileştireceğiz.

<input> alanlarını biçimlendirin. Aşağıdaki adımları izleyin:

Forma düzgünce sığmaları için %100 genişliğinde yapın.
İçindeki metnin kenarlara değmemesi için dolgu ekleyin.
Yumuşak bir renkte kenarlık uygulayın.
Köşeleri yuvarlatın.
Giriş alanlarının birbirine çok yakın görünmemesi için aralarına biraz kenar boşluğu ekleyin.
Genişliğin dolguyu ve kenarlıkları içermesi için box-sizing: border-box; kullanın.

Kendin dene

<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>