inspiriert von drPHIP132s Thread habe ich nun mal auf die Schnelle 2 weitere Meldungdesigns erstellt. Das von drPHIP132 erstellte Design habe ich mal direkt übernommen. Die Meldungen haben folgenden Sinn:
- Fehler
- Warnung
- Erolg
Hier ist ein Bild davon:
Für die Präsentation habe ich nun mal den CSS-Code in die HTML-Datei integriert:
- Code: Alles auswählen
<!DOCTYPE html>
<html>
<head>
<title>
Warning Designs
</title>
<style type="text/css">
body {
font-family: Tahoma;
padding: 0px;
margin: 0px;
font-size: 14px;
}
.error {
background: #f5cbcb;
padding: 20px;
border-top: 1px solid #f56868;
border-bottom: 1px solid #f56868;
text-align: center;
}
.warning {
background: #FFF9D7;
padding: 20px;
border-top: 1px solid #E2C822;
border-bottom: 1px solid #E2C822;
text-align: center;
}
.success {
background: #dae9da;
padding: 20px;
border-top: 1px solid #38c938;
border-bottom: 1px solid #38c938;
text-align: center;
}
.result {
display: block;
font-size: 16px;
margin-top: 10px;
}
</style>
</head>
<body>
<p class="error">
Ein Fehler ist aufgetreten. Es gab ein Problem mit der Datenbank.
<span class="result">
Bitte haben Sie Verständnis.
</span>
</p>
<p class="warning">
Um die volle Funktionalität zu genißen, wird Javascript benötigt.
<span class="result">
Bitte schalten Sie Javascript ein.
</span>
</p>
<p class="success">
Ihre Dateien wurden erfolgreich hochgeladen und sie können nun heruntergeladen werden.
<span class="result">
Probieren Sie es aus.
</span>
</p>
</body>
</html>
Hierbei geht es eigentlich nur um die Farben. Ich biete euch hier eine Art kostenloses Design, das ihr mal eben gebrauchen könntet. Wer was dazu sagen will, soll nicht zögern ;)
Mit freundlichen Grüßen,
Philipp E.
