WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
1409
cleanarray216
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
13 January 2025
Un codice di mo832860
10 July 2025
Esempio HTML della schermata di caricamento animata CSS
18 May 2025
digitando sullo schermo
HTML
Copy
<!DOCTYPE html> <html lang="pl"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Ekran Logowania</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="login-container"> <h1>Logowanie</h1> <form id="login-form"> <div class="input-group"> <label for="username">Nazwa użytkownika:</label> <input type="text" id="username" name="username" required> </div> <div class="input-group"> <label for="password">Hasło:</label> <input type="password" id="password" name="password" required> </div> <button type="submit">Zaloguj się</button> <p id="error-message"></p> </form> </div> <script src="script.js"></script> </body> </html>
CSS
Copy
body { font-family: Arial, sans-serif; background-color: #f0f0f0; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; } .login-container { background-color: #ffffff; border-radius: 8px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); padding: 20px; width: 300px; } h1 { margin-bottom: 20px; text-align: center; } .input-group { margin-bottom: 15px; } label { display: block; margin-bottom: 5px; } input { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; } button { width: 100%; padding: 10px; background-color: #007bff; color: #ffffff; border: none; border-radius: 4px; font-size: 16px; cursor: pointer; } button:hover { background-color: #0056b3; }
JS
Copy
document.getElementById('login-form').addEventListener('submit', function(event) { event.preventDefault(); const username = document.getElementById('username').value; const password = document.getElementById('password').value; // Tutaj możesz dodać logikę do obsługi logowania, np. wysyłanie danych do serwera console.log('Zalogowano użytkownika:', username); });
