Regestrierung zu 90 % in HTML und Css implementiert

master_stand_10_05_23
Nils 2023-05-07 16:44:20 +02:00
parent e82a20ad64
commit b220a0b3e4
2 changed files with 42 additions and 55 deletions

View File

@ -955,9 +955,9 @@ font-size: 30px;
} }
/*----- ANMELDEN ENDS-------*/ /*----- ANMELDEN ENDS-------*/
/* Regestrierung */ /*----- Registrierung-------*/
#regestrierungTitel{ #registrierungTitel{
position: absolute; position: absolute;
font-size: 25px; font-size: 25px;
color: #000; color: #000;
@ -965,7 +965,7 @@ font-size: 30px;
top:20px; top:20px;
} }
#datenSchutzHinweisRegestrierung{ #datenSchutzHinweisRegistrierung{
position: relative; position: relative;
font-size: 15px; font-size: 15px;
color: #000; color: #000;
@ -973,7 +973,7 @@ font-size: 30px;
top:40px; top:40px;
} }
#regestrierungAngabenZurRegestrierung{ #registrierungAngabenZurRegistrierung{
position: relative; position: relative;
font-size: 15px; font-size: 15px;
color: #000; color: #000;
@ -981,24 +981,19 @@ font-size: 30px;
top:55px; top:55px;
} }
#regestrierungInputSpan{ #registrierungInputSpan{
position: relative; position: relative;
left: 25px; left: 25px;
top:55px; top:55px;
} }
#regestrierungHr{ #registrierungHr{
position: relative; position: relative;
width: 275px; width: 275px;
color: #664220; color: #664220;
} }
#vorName{ .registrierenNormalesTextfeld{
width: 275px;
margin-bottom: 10px;
}
#nachName{
width: 275px; width: 275px;
margin-bottom: 10px; margin-bottom: 10px;
} }
@ -1023,44 +1018,36 @@ font-size: 30px;
margin-bottom: 10px; margin-bottom: 10px;
} }
#email{ .registrierenKnopf {
width: 275px;
margin-bottom: 10px;
}
#emailRep{
width: 275px;
margin-bottom: 10px;
}
#passwort{
width: 275px;
margin-bottom: 10px;
}
#passwortRep{
width: 275px;
margin-bottom: 10px;
}
.registrierenKnopf{
position: relative; position: relative;
width: 120px; width: 120px;
height: 35px; height: 35px;
background-color:#664220 ; background-color:#664220 ;
color:rgb(255, 255, 255); color:rgb(255, 255, 255);
padding-right:15px; padding: 10px 15px;
padding-left: 15px;
padding-top: 10px;
padding-bottom: 10px;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
border-radius: 8px; border-radius: 8px;
border: 0; border: 0;
} }
#registrierenAusklappe{
padding-left: 13px;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
/* Firefox */
input[type=number] {
-moz-appearance: textfield;
}
/*----- Registrierung Ende-------*/
/*Largest Devices*/ /*Largest Devices*/
@media screen and (max-width:1400px){ @media screen and (max-width:1400px){

View File

@ -35,19 +35,19 @@
<form action=""> <form action="">
<div class="container"> <div class="container">
<span id="regestrierungTitel" > Regestrierung </span> <span id="registrierungTitel" > Regestrierung </span>
<br> <br>
<p id="datenSchutzHinweisRegestrierung" > Über diese Webseite werden personenbezogene Daten erhoben und genutzt. Für Details, beziehen Sie sich bite auf die Seite Datenschutz.</p> <p id="datenSchutzHinweisRegistrierung" > Über diese Webseite werden personenbezogene Daten erhoben und genutzt. Für Details, beziehen Sie sich bite auf die Seite Datenschutz.</p>
<h4 id="regestrierungAngabenZurRegestrierung">Angaben zur Regestrierung<hr id="regestrierungHr"></h4> <h4 id="registrierungAngabenZurRegistrierung">Angaben zur Regestrierung<hr id="registrierungHr"></h4>
<br> <br>
<span id="regestrierungInputSpan" > <span id="registrierungInputSpan" >
<label for="vorName"><b>Vorname</b></label> <label for="vorName"><b>Vorname</b></label>
<br> <br>
<input type="text" name="vorName" id="vorName" required> <input type="text" name="vorName" id="vorName" class="registrierenNormalesTextfeld" required>
<br> <br>
<label for="nachName"><b>Nachname</b></label> <label for="nachName"><b>Nachname</b></label>
<br> <br>
<input type="text" name="nachName" id="nachName" required> <input type="text" name="nachName" id="nachName" class="registrierenNormalesTextfeld" required>
<br> <br>
<label for="strasse"><b>Straße und Hausnummer</b></label> <label for="strasse"><b>Straße und Hausnummer</b></label>
<br> <br>
@ -61,28 +61,27 @@
<br> <br>
<label for="email"><b>E-Mail-Adresse</b></label> <label for="email"><b>E-Mail-Adresse</b></label>
<br> <br>
<input type="email" name="email" id="email" required> <input type="email" name="email" id="email" class="registrierenNormalesTextfeld" required>
<br> <br>
<label for="emailRep"><b>E-Mail-Adresse bestätigen</b></label> <label for="emailRep"><b>E-Mail-Adresse bestätigen</b></label>
<br> <br>
<input type="email" name="emailRep" id="emailRep" required> <input type="email" name="emailRep" id="emailRep" class="registrierenNormalesTextfeld" required>
<br> <br>
<label for="passwort"><b>Passwort</b></label> <label for="passwort"><b>Passwort</b></label>
<br> <br>
<input type="password" name="passwort" id="passwort" required> <input type="password" name="passwort" id="passwort" class="registrierenNormalesTextfeld" required>
<br> <br>
<label for="passwortRep"><b>Passwort bestätigen</b></label> <label for="passwortRep"><b>Passwort bestätigen</b></label>
<br> <br>
<input type="password" name="passwortRep" id="passwortRep" required> <input type="password" name="passwortRep" id="passwortRep" class="registrierenNormalesTextfeld" required>
<br> <br>
<button type="submit" class="registrierenKnopf">Registrieren</button> <button type="submit" class="registrierenKnopf">Registrieren</button>
<br> <br><br>
<div class="container signin"> <details>
<p>Sie habe bereits ein Konto?<a href="#"> Jetzt anmelden</a> </p> <summary>Sie habe bereits ein Konto?</summary>
</div> <p id="registrierenAusklappe"> <a href="anmelden.html"> Jetzt anmelden</a></p>
</details>
</span> </span>
</div> </div>
</form> </form>
</div> </div>
@ -112,6 +111,7 @@
<div class="line"></div> <div class="line"></div>
<div class="line"></div> <div class="line"></div>
</label> </label>
</div>
</nav> </nav>