Hilfe
Neues Thema
Antworten
Hab mich heute das erste mal an css design versucht. Hat auch relativ gut geklappt, nur bekomme ich ein paar sachen nicht so hin, wie ich es haben möchte.
1. Geht gleich bei der ersten Box oben los.(rote Box)
Das mit dem Logo hat ja soweit geklappt, aber nun möchte ich noch auf der rechten Seite ein banner plazieren und davor ein senkrechtes Bild wo "Werbung" steht.
Nur wenn ich das einfügen will, ist es immer nur direkt nebem dem logo.
2. Die Box mit dem oberen Menü.(grüne Box)
Kann man es mit CSS erreichen, daß das obere Menü eventuell gleichmäßig über die gesamte Breite der Box verteilt ist, also das nicht nur in der Mitte alle Funktionen sind?
3. Die linke Box mit dem Menü. (türkise Box)
Da wollte ich eigentlich 3 Boxen untereinander machen. Für jeden großen Menüpunkt eine, aber wenn ich das gemacht habe, ist die Box mit dem Content immer weiter nach unten gerutscht. Muß man bei den Boxen plazieren eine bestimmte Reihenfolge einhalten?
4. Die große Content Box. (blaue Box)
Hier soll später mal eine Tabelle mit Hilfe von php und einer SQL Datenbank generiert werden. Die soll 11 Spalten haben. Kann man so eine Tabelle auch mit CSS erzeugen? also wenn die Daten per php aus der sql datenbank geholt werden, daß die durch css ordentlich und in tabellenform angeordnet werden? Gleich beim betreten der seite soll die Tabelle angezeigt werden (dann nur mit 10-12 Zeilen). Dadrunter die News. Oder besser dafür noch eine extra Box? Die News sollen nur unter der Tabelle angezeigt werden, wenn man auf Home klickt bzw auf die Seite verbindet. Ansonsten nicht.
5.Im Anhang ist noch ein Bild. Die bunten Boxen waren nur für mich beim erstellen gedacht, aber zum erklären welche boxen ich meine, hab ich das gleich mal dringelassen.
css:
body
{
font-family:arial;
}
div.header
{
height:;
margin:10px 2% 0px 2%;
border:1px solid #000000;
padding:10px;
background-color:#FF0000;
font-size:8pt;
font-weight:normal;
}
div.navvert
{
float:left;
width:16%;
height:;
margin:10px 2% 10px 2%;
border:1px solid #000000;
padding:10px;
background-color:#00FFFF;
text-align:left;
font-size:8pt;
font-weight:bold;
}
div.navhor
{
height:;
margin:0px 2% 0px 2%;
border:1px solid #000000;
padding:10px;
background-color:#00FF00;
text-align:center;
font-size:8pt;
font-weight:normal;
}
div.content
{
width:;
height:500px;
margin:10px 2% 10px 20%;
border:1px solid #000000;
padding:10px;
background-color:#0000FF;
text-align:left;
font-size:8pt;
font-weight:bold;
}
div.footer
{
height:;
margin:10px 2% 0px 2%;
border:1px solid #000000;
padding:10px;
background-color:#880000;
text-align:center;
font-size:8pt;
font-weight:normal;
}
#nav_sections{
display:block;
height:14px;
width:100%;
margin-left:5px;
margin-top:5px;
margin-bottom:5px;
font-size:14pt;
}
html/php
<!-- HEADER START --> <div class="header"> <img src="logo_klein.jpg" /> </div> <!-- HEADER END --> <!-- TOPMENU START --> <div class="navhor"> <a href="index.php">News</a> | <a href="index.php">Forum</a> | <a href="index.php">IRC</a> | <a href="index.php">Suchen</a> | <a href="index.php">FAQ</a> | <a href="index.php">Team</a> </div> <!-- TOPMENU END --> <!-- LEFTMENU START --> <div class="navvert"> <div id="nav_sections"><h4>Sections</h4></div> <ul> <li><a href="index.php">Untermenue 1</a></li> <ul> <li><a href="index.php">Untermenue 1.1</a></li> <li><a href="index.php">Untermenue 1.2</a></li> <li><a href="index.php">Untermenue 1.3</a></li> <li><a href="index.php">Untermenue 1.4</a></li> </ul> <li><a href="index.php">Untermenue 2</a></li> <li><a href="index.php">Untermenue 3</a></li> <li><a href="index.php">Untermenue 4</a></li> </ul> <div id="nav_sections"><h4>Community</h4></div> <ul> <li><a href="index.php">Untermenue 1</a></li> <li><a href="index.php">Untermenue 2</a></li> </ul> <div id="nav_sections"><h4>InfoBox</h4></div> <ul> Hier steht dann irgendwann mal ein Informationstext :-) Hoffe ich zumindest... </ul> </div> <!-- LEFTMENU END --> <!-- MAINPAGE START --> <div class="content"> Test </div> <!-- MAINPAGE END --> <!-- FOOTER START --> <div class="footer"> Content Management System Version 0.1alpha. (C) 2005 by evo2 - All Rights Reserved.<br> </div> <!-- FOOTER END -->
Besten Dank im vorraus.
Mfg
evo2
Nach oben
) immer nur div genommen.
