WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
PAGINA DI CARICAMENTO NETFLIX
2233
ASKMUHAMMAD_2K
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
30 May 2025
icona di caricamento 4
28 November 2024
Pagina di destinazione - Hacking
22 August 2025
Esempio di pulsanti di contatto HTML
HTML
Copy
Netflix Login Page
Sign In
Email or phone number
Password
Sign In
Remember me
Need help?
New to Netflix?
Sign up now
This page is protected by Google reCAPTCHA to ensure you're not a bot.
Learn more.
CSS
Copy
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap"); * { margin: 0; padding: 0; box-sizing: border-box; font-family: "Roboto", sans-serif; } body { background: #000; } body::before { content: ""; position: absolute; left: 0; top: 0; opacity: 0.5; width: 100%; height: 100%; background: url("http://codingstella.com/wp-content/uploads/2024/01/download-4.jpeg"); background-position: center; } nav { position: fixed; padding: 25px 60px; z-index: 1; } nav a img { width: 167px; } .form-wrapper { position: absolute; left: 50%; top: 50%; border-radius: 4px; padding: 70px; width: 450px; transform: translate(-50%, -50%); background: rgba(0, 0, 0, 0.75); } .form-wrapper h2 { color: #fff; font-size: 2rem; } .form-wrapper form { margin: 25px 0 65px; } form .form-control { height: 50px; position: relative; margin-bottom: 16px; } .form-control input { height: 100%; width: 100%; background: #333; border: none; outline: none; border-radius: 4px; color: #fff; font-size: 1rem; padding: 0 20px; } .form-control input:is(:focus, :valid) { background: #444; padding: 16px 20px 0; } .form-control label { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); font-size: 1rem; pointer-events: none; color: #8c8c8c; transition: all 0.1s ease; } .form-control input:is(:focus, :valid) ~ label { font-size: 0.75rem; transform: translateY(-130%); } form button { width: 100%; padding: 16px 0; font-size: 1rem; background: #e50914; color: #fff; font-weight: 500; border-radius: 4px; border: none; outline: none; margin: 25px 0 10px; cursor: pointer; transition: 0.1s ease; } form button:hover { background: #c40812; } .form-wrapper a { text-decoration: none; } .form-wrapper a:hover { text-decoration: underline; } .form-wrapper :where(label, p, small, a) { color: #b3b3b3; } form .form-help { display: flex; justify-content: space-between; } form .remember-me { display: flex; } form .remember-me input { margin-right: 5px; accent-color: #b3b3b3; } form .form-help :where(label, a) { font-size: 0.9rem; } .form-wrapper p a { color: #fff; } .form-wrapper small { display: block; margin-top: 15px; color: #b3b3b3; } .form-wrapper small a { color: #0071eb; } @media (max-width: 740px) { body::before { display: none; } nav, .form-wrapper { padding: 20px; } nav a img { width: 140px; } .form-wrapper { width: 100%; top: 43%; } .form-wrapper form { margin: 25px 0 40px; } }
JS
Copy
no needed!!!