WEBLEB
Accueil
Éditeur
Connexion
Pro
Français
English
Français
Español
HTML
CSS
JS
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Document</title> </head> <body> <div class="bt"> <fieldset> <legend>INFORMATION</legend> <label for="nom">NOM:</label><br><input type="text"><br> <label for="pernom">PERNOM:</label><br><input type="text"><br> <label for="mot">MODE PASSE:</label><br><input type="password"><br> <label for="date">DATE DE AGE</label><br><input type="date"><br> </fieldset> <nav> <a href="https://www.google.com/"><img src="https://th.bing.com/th?q=Premier+Logo+De+Google&w=120&h=120&c=1&rs=1&qlt=70&o=7&cb=1&pid=InlineBlock&rm=3&mkt=en-WW&cc=BF&setlang=fr&adlt=moderate&t=1&mw=247" width="30"></a> <a href="https://www.facebook.com/"><img src="https://tse4.mm.bing.net/th/id/OIP.cKm1k1GxIjCHnrG6erS39QHaHa?w=512&h=512&rs=1&pid=ImgDetMain&o=7&rm=3" width="30"></a> <a href="https://www.instagram.com/"><img src="https://th.bing.com/th/id/R.354154e6686a86a3abf3619ef82c236b?rik=rlAyvd4KpLe%2fuQ&pid=ImgRaw&r=0" width="30"></a> </nav> <button>CREE VOTRE COMPTE</button> </div> </body> </html>
body{ background: black; display: flex; justify-content: center; margin: 90px; } .bt{ border: 3px solid red; height: 400px; width: 350px; box-shadow: 0 0 10px red, 0 0 20px red; background: black; } legend{ color: white; } fieldset{ width: 300px; display: block; margin: auto; border: 2px solid red; box-shadow: 0 0 10px red, 0 0 20px red; } label{ font-family: ARIAL; color: white; } input{ display: block; margin: auto; width: 280px; padding: 3px ; border: 3px solid red; box-shadow: 0 0 10px red, 0 0 20px red; } nav{ display: flex; margin: 10px; justify-content: space-evenly; } img{ border-radius: 50%; } button{ display: block; margin: 20px auto; padding: 8px 90px; border: 3px solid; border-image: linear-gradient(red)1; background: black; color: white; box-shadow: 0 0 10px red, 0 0 20px red; }
/* Replace with your JS Code (Leave empty if not needed) */
Preview
Open Advanced Editor
Publish Code
Full Screen
HTML
CSS
JS
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Document</title> </head> <body> <div class="bt"> <fieldset> <legend>INFORMATION</legend> <label for="nom">NOM:</label><br><input type="text"><br> <label for="pernom">PERNOM:</label><br><input type="text"><br> <label for="mot">MODE PASSE:</label><br><input type="password"><br> <label for="date">DATE DE AGE</label><br><input type="date"><br> </fieldset> <nav> <a href="https://www.google.com/"><img src="https://th.bing.com/th?q=Premier+Logo+De+Google&w=120&h=120&c=1&rs=1&qlt=70&o=7&cb=1&pid=InlineBlock&rm=3&mkt=en-WW&cc=BF&setlang=fr&adlt=moderate&t=1&mw=247" width="30"></a> <a href="https://www.facebook.com/"><img src="https://tse4.mm.bing.net/th/id/OIP.cKm1k1GxIjCHnrG6erS39QHaHa?w=512&h=512&rs=1&pid=ImgDetMain&o=7&rm=3" width="30"></a> <a href="https://www.instagram.com/"><img src="https://th.bing.com/th/id/R.354154e6686a86a3abf3619ef82c236b?rik=rlAyvd4KpLe%2fuQ&pid=ImgRaw&r=0" width="30"></a> </nav> <button>CREE VOTRE COMPTE</button> </div> </body> </html>
body{ background: black; display: flex; justify-content: center; margin: 90px; } .bt{ border: 3px solid red; height: 400px; width: 350px; box-shadow: 0 0 10px red, 0 0 20px red; background: black; } legend{ color: white; } fieldset{ width: 300px; display: block; margin: auto; border: 2px solid red; box-shadow: 0 0 10px red, 0 0 20px red; } label{ font-family: ARIAL; color: white; } input{ display: block; margin: auto; width: 280px; padding: 3px ; border: 3px solid red; box-shadow: 0 0 10px red, 0 0 20px red; } nav{ display: flex; margin: 10px; justify-content: space-evenly; } img{ border-radius: 50%; } button{ display: block; margin: 20px auto; padding: 8px 90px; border: 3px solid; border-image: linear-gradient(red)1; background: black; color: white; box-shadow: 0 0 10px red, 0 0 20px red; }
/* Replace with your JS Code (Leave empty if not needed) */
Preview
Validating your code, please wait...