Hallo,
zuerst mal danke für euere Tips wie man was hier machen soll. Bin wie gesagt auch hier ein absoluter Neuling.
Ich füge am besten mal den html-Code der seite bei und die CSS-Befehle, die einmal im Ordner Struktur und einmal in layout untergebracht sind.
``
* {
padding: 0;
margin: 0;
}
body {
font: 100% Verdana, Arial, Helvetica, sans-serif, fantasy;
text-align: center;
background-color: white;
margin-top: 1px;
}
#mother {
width: 780px;
text-align: center;
background-color: white;
margin: 0 auto;
border: 1px solid black;
height:520px;
}
#header {
height: 155px;
background-color: yellow;
width: absolute;
margin: 0 auto;
border: 1px solid black;
}
#menu {
float: left; /* schwebt links */
width: 140px;
background-color: #CCCCCC;
padding: 20px 5px;
height: 477px;
border: 1px solid black;
}
#main {
background-color: white;
padding: 20px 10px;
margin: 0 0 0 112px;
border: 1px solid brown;
}
#column {
float: right;/* schwebt rechts */
width: 100px;
background-color: #CCCCCC;
padding: 20px 5px;
height: 320px;
border: 1px solid #ff6699;
text-align: right;
}
#footer {
clear: both;
height: 30px;
padding: 5px;
background-color: #CCCCCC;
border: 3px solid blue;
}
**********
/* Überschrift im header - Div */
#header h1 {
color: black;
padding: 5px;
}
}
/* Menüleiste (menu-DIV) */
#menu a {
text-decoration: none;
font-weight: bold;
color: black;
display: block;
padding: 3px;
}
#menu a:hover {
color: red;
}
#menu li {
border: 1px solid #ffff99; /* trick */
#menu #high {
font-weight: bold;
color: white;
background-color: #ff9900;
/* block dürfte für die Aufwertung und Abstand des Menues zuständig sein, deswegen sperre ich es mal ein!
display: block; */
padding: 3px;
}
#menu ul {
line-height: 1.6;
list-style-type: none;
}
#menu ul ul {
line-height: 1.4;
list-style-image: url(reddot.gif)
padding-left: 20px;
}
/* ENDE DER MENÜLEISTE */
/* ab hier Main-DIV */
/* Hauptüberschrift */
#main h1 {
font-size: 1.3em;
font-weight: bold;
color: #333399;
padding-bottom: 14px;
}
/* Unterschriften */
#main h2 {
font-size: lem;
line-height: 1.4;
margin-bottom: 6px;
}
/* normaler Fließtext */
#main p {
margin-bottom: 12px;
line-height: 1.3;
}
/* Kastenformat */
'main .kasten {
text-align: center;
padding: 5px;
background-color: #ffff99;
border: solid 1px black;
width: 500px;
}
/* Minigrafik rechts ausrichten */
#main .floatR130 {
float: right;
margin-left: 5px;
margin-right: 130px;
}
/* UL mit grafischen Aufz.zeichen */
#main ul {
list-style-image: url(reddot.gif);
margin-left: 30px;
margin-bottom: 10px;
line-height: 1.5;
}
/* Strong umdefinieren */
#strong {
font-family: "Century Gothic", Verdana, Arial, Helvetica; sans-serif, fantasy;
color: red;
}
/* End main-DIV */
****** fertig mit css
Nun der HTML-Code
``
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/losse.dtd">
<html>
<head>
<title>Die Weltneuheit auf dem Markt. Fensterklappladen mit eingebauten Motor, Einbruchsicher</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link href="css/struktur.css" rel="stylesheet" type="text/css">
<link href="css/layout.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="mother">
<div id="menu">menu Platz für das Menü</div>
<div id="header">
<h1 align="center">Ich versuche!!</h1>
</div>
<div id="column">was kommt nun dabei heraus???</div>
<div id="main">main Hauptbereich für den Inhalt<br />und wieder neue Versuche um zu verstehen<br />mal schauen<br />ob sich da alles<br />erweitert<br />und ich muss<br />susen überzeugen<br /> dass alles richtig ist</div>
<div id="footer">footer ist gleich die Fußzeile</div>
</div>
</body>
</html>
Vielleicht kann man mich nun besser verstehen. Möchte im Header (kopfzeile) eine Hintergrundgrafig einbauen, als html-code geht es ohne Problem, aber nur als normale Grafik. Als Hintergrundbild geht irgendwie beides nicht, das Bild wird nicht angezeigt!
LG
Ralf
@@wildstier:
nuqneH
Ich habe meine Seite AUF 4 Spalten aufgeteilt, […]
Als 4 Boxen nebeneinander.
[…] das heißt, Kopfzeile, Fusszeile, Navi und main.
Oder doch nicht, sondern min. 3 Boxen untereinander.
Dass Spalten und Zeilen etwas andees sind, weißt du?
Qapla'