• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Feedback gewünscht Code verkürzen

DerNeuling21

Mitglied
Hallo Community,
ich endlich meine erste Seite fertig und möchte jetzt gerne wissen wie ich meinen Code hätte verkürzen können ?

https://picload.org/view/drowairl/unbenannt.png.html (musste hier hochladen, weil die Datei größer als 1 MB ist)

So sieht die Seite bisher aus und das ist der Code:

HTML:
<html>
    <head>
        <title>Wolly's Musik Stream</title>
        <link rel="shortcut icon" href="YouTubeLogo.png">
        <link rel="stylesheet" href="design.css">  
    </head>
   
    <body>      
            <div class="logboa" >
                <p id="login">Anmelden</p>
                <form>
                    <div id="inob">
                        <input placeholder="E-Mail" type="text" name="username">
                    </div>              
                    <div id="inun">
                        <input placeholder="Passwort" type="password" name="password">
                    </div>
                    <input type="submit" name="submit" value="LOGIN" class="send-login">
                </form>                              
            </div>
    </body>

</html>

Code:
* { padding: 0;margin: 0; }

@font-face{
    font-family: Bender-Bold;
    src: url(Bender-Bold.woff)
}

body {
    background-image: url("Escape-from-Tarkov.jpg");
    margin: 0 auto;
    background-repeat: no-repeat;
    background-size: cover;
}
   
#login {
    text-align: center;
    color: #996600;
    font-size: 38;
    font-style: italic;
    margin-top: -40px;
    margin-bottom: 20;
    font-family: Bender-Bold;  
}

.logboa {
    margin: 0 auto;
    height: 162px;
    width: 350px;
    margin-top: 250px;
    border-radius: 5px;
    background-color: black;
    text-align: center;  
    padding-top: 70px;
    margin-bottom: 8px;  
}

#inob {
    margin-bottom: 8px;
}
input {
    font-family: Bender-Bold;
    font-size: 18;
    }
   
.send-login {
    padding: 4px 30px;
    color: #fff;
    background-color: #2ECC71;
    font-family: Bender-Bold;
    border-radius: 4px;
    border: none;
    margin-top: 20px;
    font-style: italic;
}

::-webkit-input-placeholder {
    text-align: center;
}
 
Werbung:
Da gibt es nicht wirklich was zu kürzen...
Hier und da vllt. mal ein CSS-Attribut, aber nicht wirklich was, was sich lohnt. Die 2-3 Attribute machen es jetzt auch nicht aus.

Du kannst höchstens die div-Tags um die input Tags wegmachen und stattdessen die inputs stylen.
 
Zurück
Oben