Seite 7 von 14
6. CSS mit 3 Farben (deutsche Variablen!)
C:\xampp\htdocs\restaurant6\templates\restaurant_ihk\css\style.css
Farben später nur hier ändern — gesamtes Design passt sich an.
Datei: user.css
:root{
--hauptfarbe: dunkelrot;
--nebenfarbe: creme;
--akzentfarbe: olivgruen;
}
/* globale Einstellungen */
body{
margin:0;
font-family:Arial, Helvetica, sans-serif;
background:var(--nebenfarbe);
}
/* Kopfbereich */
.kopf{
background:var(--hauptfarbe);
color:white;
padding:20px;
}
.navigation a{
color:white;
text-decoration:none;
margin:10px;
}
/* Hero Bereich */
.hero{
background:var(--akzentfarbe);
color:white;
padding:80px;
text-align:center;
}
/* Hauptbereich */
.hauptbereich{
display:flex;
}
.inhalt{
width:70%;
padding:30px;
}
.seite{
width:30%;
background:#f2f2f2;
padding:20px;
}
/* Footer */
.fuss{
background:var(--hauptfarbe);
color:white;
padding:20px;
text-align:center;
}