نموذج لجمع معلومات المستخدم من خلال حقول الإدخال.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Inline CSS Form Example</title>
</head>
<body>
<form action="#" method="post" style="max-width: 500px; margin: 20px auto; padding: 20px; border: 1px solid #ccc; background-color: #f9f9f9;">
<div style="margin-bottom: 15px;">
<label for="username" style="display: block; margin-bottom: 5px; font-weight: bold;">Username:</label>
<input type="text" id="username" name="username" placeholder="Enter your username" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="password" style="display: block; margin-bottom: 5px; font-weight: bold;">Password:</label>
<input type="password" id="password" name="password" placeholder="Enter your password" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<button type="submit" style="padding: 10px 20px; background-color: #007BFF; color: white; border: none; border-radius: 4px; cursor: pointer;">
Login
</button>
</form>
</body>
</html>