| Weitere Artikel aus dem Webentwickler Blog |
| Teilen |  |
 |
 |
In den letzten beiden Beiträgen haben wir uns vor allem mit dem Ersetzen der Schriftart durch eine andere sowie dem Header (also dem Kopfbereich des Template) gewidmet. Es gibt aber auch die Möglichkeit, ein Hintergrundbild für die Webseite festzulegen. Die entsprechenden Daten sind im Abschnitt body_bg der CSS-Datei enthalten.
Hintergrundbild
.body_bg {
background: #fefefe;
margin: 30px 0 0 0;
background-image: url(../body_bg.jpg);
background-repeat: repeat-x;
}
Da keine Größenänderung des Hintergrundbildes nötig ist, sondern wir lediglich ein anderes Bild wünschen, bleibt der Code weitgehend so, wie er ist. Es wird lediglich der Name der einzubindenen Bilddatei in der Zeile background-image: geändert. In unserem Beispiel ist dies body_bg.jpg.
Boxen auf der linken und rechten SeiteDie Boxen auf der linken und auf der rechten Seite sind folgendermaßen codiert:
/* LEFT COL H3 */
#leftcolumn h3, #rightcolumn h3 {
font-family: Tahoma, Arial, sans-serif;
width: 170px;
color: #fff; /*color: #798950;*/
font-size: 12px;
height: 36px;
text-decoration: none;
text-align: left;
padding: 0 0 0 10px;
font-weight: bold;
line-height: 25px;
margin: 0;
background: url(../images/h3.png) top left no-repeat;
Damit werden die Größe und die Positionierung der Menüboxen festgelegt. Hier das Hauptmenü: 
Der Fußbereich der Seite (Footer)Den so genannten Footer beschreibt der gleichnamige Abschnitt:
#footer {
margin: 0 auto;
text-align: center;
width: 960px;
height: 54px;
}
Der Textabschnitt wurde dem Buch “Joomla! für Profis” von Stephan Brey entnommen, das im Franzis-Verlag erschienen ist. Sie können es hier direkt bestellen.
Stephan Brey
Lernen Sie die ganze Vielfalt vom Franzis Buch- und Softwareverlag kennen
