Eigene HP 7 - Boxen
Die rechten Boxen können wir jetzt noch unserem Design farblich anpassen -
und einen Rand hinzufügen: Die Codes kenn wir ja schon von den Schriftfarben - die Farben können auch hier wieder angepasst werden, wie es schon beschrieben wurde - wenn wir den Rand nicht wollen - geben wir bei
border: 0px ein - der Code muß für jede Box gemacht werden:
td.shouty{color:#ff0000;background-image: url(URL);background-color: #000000;border: 3px solid #c6c5c5;}
td.shouty2{color:#ff0000;background-image: url(URL);background-color: #000000;border: 3px solid #c6c5c5;}
td.shouty3{color:#ff0000;background-image: url(URL);background-color: #000000;border: 3px solid #c6c5c5;}
td.shouty4{color:#ff0000;background-image: url(URL);background-color: #000000;border: 3px solid #c6c5c5;}
td.shouty5{color:#ff0000;background-image: url(URL);background-color: #000000;border: 3px solid #c6c5c5;}
Man könnte die Boxen auch weglassen - das funktioniert aber nur im Internet Explorer - in dem wir im Content - also im mittleren Textfeld einfach breitere Bilder, etc. einfügen - im Firefox führt das aber dann dazu, das auf Scrollbalken umgeschaltet wird und das sieht dann absolut unprofessionell aus. Also sollten wir die Boxen mit etwas füllen, was zu unserer Seite passt - vom design her und vielleicht auch vom Thema.
Das sind die fertigen Boxen - mit grauem Rand und schwarzem Hintergrund. Jetzt sehen wir im Beispielbild die untere Leiste der boxen weg ist- sie sind gewissermaßen freigestellt - auch das ist ganz einfach:
td.edit_rb_footer{visibility: hidden; width: 0px ;}
damit ist die Fußleiste der Box komplett weg. Jetzt müßt ihr die Boxen nur noch mit Inhalt füllen - da könnt ihr hier im Forum mal stöbern
http://coolplace.co.ohost.de/hpforum/viewforum.php?f=4
da findet ihr sehr übersichtlich Homepage-Extras ohne Ende.
Im nächsten Tutorial - ändern wir den Hintergrund - den Streifen rechts und auch gleich die Bilder unter der Navigation und unter den Boxen.
