Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag29.03.2010 um 14:06 (UTC)    
Titel: Wie setze ich den Code richtig ein ?!

Hallo zusammen.

Ich hab nun endlich das passende Design gefunden,
sogar incl dropdown Menu. Leider habe ich das Problem,
dass ich nicht weiß wie ich den Code einfügen muss im Baukasten...

Ich poste hier mal die Codes die ich habe,
evtl kann mir da jemand helfen,wäre super nett.

---------------------------------------------------------------------------------------
index.htm


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="robots" content="INDEX,FOLLOW">
<meta name="keywords"
content="homepage,dokument,webpage,page,web,netz,homepage dokument webpage page web netz">
<meta name="description"
content="homepage, dokument, webpage, page, web, netz" >
<title>homepage, dokument, webpage, page, web, netz, homepage dokument webpage page web netz</title>
<!-- Der nachfolgende einzeilige Copyright-Vermerk (c) ist nicht zu löschen.-->

<!-- (c)Copyright by S.I.S.Papenburg / www.on-mouseover.de/templates/ -->
<!--Ein Entfernen dieses Copyright/Urheberrecht-Vermerks kann rechtliche Schritte nach sich ziehen -->

<link rel="stylesheet" href="format.css" type="text/css">
<link rel="stylesheet" href="menue.css" type="text/css">
<!--[if lte IE 6]>
<link rel="stylesheet" media="all" type="text/css" href="ie_format.css" />
<![endif]-->
</head>
<body >


<table align="center" id="breite" cellspacing="0" cellpadding="0" border="0" >
<tr>



<td align="center" width="100%" >



<!--schatten um die seite oben -->
<table width="100%" align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" id="s1" ><img src="images/s1.jpg" width="22" height="22" border="0" alt=""></td>
<td id="s2"><img src="images/s2.jpg" width="22" height="22" border="0" alt=""></td>
<td id="s3" ><img src="images/s3.jpg" width="22" height="22" border="0" alt=""></td>
</tr>
<tr>
<td valign="top" id="s4" ><img src="images/s4.jpg" width="22" height="62" border="0" alt=""></td>
<td class="haupt" >
<!--ende schatten um die seite oben -->
<!--kopf-->
<table width="100%" border="0" cellpadding="0" cellspacing="0" >
<tr>
<td id="top1" ><span id="name">.: Name der Homepage :.</span></td>
</tr>
<tr>
<td id="top2" >



<table width="100%" cellspacing="0" cellpadding="0" border="0" >
<tr>

<td align="center" width="100%" height="100%">
&nbsp;
</td>
</tr>
</table>




</td>
<tr>
<td align="center" id="top3" >
<div id="all">




<div class="menu" >
<!-- unteres Menu -->
<ul>
<li><a class="hide" href="#">Gruppe1</a>
<!--[if lte IE 6]>
<a href="#">Gruppe1
<table><tr><td>
<![endif]-->
<ul>
<li><a href="index.html">Seite 11</a></li>
<li><a href="index.html">Seite 12</a></li>
<li><a href="index.html">Seite 13</a></li>
<li><a href="index.html">Seite 14</a></li>
</ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>
<li><a class="hide" href="#">Gruppe2</a>
<!--[if lte IE 6]>
<a href="#">Gruppe2
<table><tr><td>
<![endif]-->
<ul>
<li><a href="index.html">Seite 21</a></li>
<li><a href="index.html">Seite 22</a></li>
<li><a href="index.html">Seite 23</a></li>
</ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>
<li><a class="hide" href="#">Gruppe3</a>
<!--[if lte IE 6]>
<a href="#">Gruppe3
<table><tr><td>
<![endif]-->
<ul>
<li><a href="index.html">Seite 31</a></li>
<li><a href="index.html">Seite 32</a></li>
<li><a href="index.html">Seite 33</a></li>
</ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>
<li><a class="hide" href="#">Gruppe4</a>
<!--[if lte IE 6]>
<a href="#">Gruppe4
<table><tr><td>
<![endif]-->
<ul>
<li><a href="index.html">Seite 41</a></li>
<li><a href="index.html">Seite 42</a></li>
<li><a href="index.html">Seite 43</a></li>
<li><a href="index.html">Seite 44</a></li>
</ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>

</ul>
<!-- ende unteres Menu-->
</div>


</div>



<!-- ende menü oben--></td>
</tr>
</table>



<!--ende oben-->


<!-- inhalt-->

<table align="center" width="100%" border="0" cellpadding="0" cellspacing="0" >

<tr>



<td valign="top" id="inhalt">


</td>
</tr>
</table>
<!-- ende inhalt-->





<!-- fuss-->

<table width="100%" border="0" cellpadding="0" cellspacing="0" >
<tr>
<td id="fuss1" ><table align="center" id="menu1" border="0" cellpadding="0" cellspacing="0" >
<tr>
<td >
<a href="index.html" >Home</a></td>
<td>|</td>
<td ><a href="index.html" >Kontakt</a></td>
<td>|</td>
<td ><a href="index.html" >Impressum</a></td>
</tr>
</table>
<!-- ende menü unten -->
</td>
</tr>
<tr>
<td id="fuss2" >Mike Muster GmbH & Co. KG&nbsp;&nbsp;•&nbsp;&nbsp;Spezialstrasse 55&nbsp;&nbsp;•&nbsp;&nbsp;55234 Sampletown <br>
</td>
</tr>
</table>

<!-- schatten um die seite mitte und unten -->
<td valign="top" id="s6" ><img src="images/s6.jpg" width="22" height="22" border="0" alt=""></td>
</tr>
<tr>
<td id="s7" ><img src="images/s7.jpg" width="22" height="22" border="0" alt=""></td>
<td id="s8" ><img src="images/s8.jpg" width="202" height="22" border="0" alt=""></td>
<td id="s9" ><img src="images/s9.jpg" width="22" height="22" border="0" alt=""></td>
</tr>
</table>
<!--ende schatten um die seite mitte und unten -->

</td>
</tr>
</table>






</body>
</html>

--------------------------------------------------------------------------------------
format.css



/* breite der gesamtkonstruktion */
#breite {width:840px}


body
{margin-top: 20px; margin-left: 0px; margin-right: 0px;margin-bottom: 20px; background-color: #bfc8aa;
}


/* überschriften */
h2{ color:#7f9155;
margin-bottom:28px;letter-spacing:2px;
font-family: trebuchet ms,verdana,arial,helvetica, verdana, tahoma, sans-serif;
font-size: 23px;
font-weight:normal;

}

.haupt {background-color:#;border-left:solid 1px #045944;border-right:solid 1px #045944;
border-top:solid 1px #045944;border-bottom:solid 1px #045944;
border:solid 18px #fff;
}



#top1 {height:0px;
background-color:#7f9155;
height:40px;
width:100%;text-align:center;
}

#top2 {background-image:url(http://img.webme.com/pic/d/drachenherz-quelle/earthdancemmm.jpg);
background-repeat:no-repeat;
background-position:50% 50%;
height:412px;
background-color:#405A00;
}

#top3 {
background-color:#7f9155;
height:43px;
border:solid 1px #000;
color:#56686D;
width:100%;
vertical-align:middle;
}



#name {height:0px;;
letter-spacing:2px;
color:#fff;
padding-left:20px;
font-family: trebuchet ms,verdana,arial,helvetica, verdana, tahoma, sans-serif;
font-size:20px
}


#inhalt {height:900px;
color:#7f9155;
padding-top: 60px; padding-bottom: 70px;
padding-left: 45px;padding-right:45px;
background-color:#fff;
letter-spacing:0px;
width:100%;
vertical-align:top;
text-align:left;
font-size: 16px;line-height: 21px;
font-family: trebuchet ms,verdana,arial,helvetica, verdana, tahoma, sans-serif;
letter-spacing:0px;
}



#fuss1 {
color:#153125;background-color:#fff;
letter-spacing:0px;
font-size: 14px;line-height: 20px;
font-family: trebuchet ms,
verdana,arial,helvetica, verdana, tahoma, sans-serif;
height:30px;
text-align:center;
width:100%;
font-style:italic;
padding-bottom:15px
}


#fuss2 {
color:#fff;background-color:#7f9155;
letter-spacing:0px;
font-size: 14px;line-height: 20px;
font-family: trebuchet ms,
verdana,arial,helvetica, verdana, tahoma, sans-serif;
height:90px;
text-align:center;
width:100%;
font-style:italic;
}


/* ========== Schatten um Hauptbereich ========== */


#s1 {
background-image:url(images/s1.jpg);
background-repeat:no-repeat;
background-position: 100% 0%;
height:22px;
line-height:22px;
width:22px;
}

#s2 {
background-image:url(images/s2.jpg);
background-repeat:repeat-x;
background-position: 0% 0%;
height:22px;
line-height:22px;
width:100%;
}

#s3 {
background-image:url(images/s3.jpg);
background-repeat:repeat-x;
background-position: 0% 0%;
height:22px;
line-height:22px;
width:22px;
}

#s4 {
background-image:url(images/s4back.jpg);
background-repeat:repeat-y;
background-position: 100% 100%;
height:100%;
width:22px;
}



#s6 {
background-image:url(images/s6back.jpg);
background-repeat:repeat-y;
background-position: 0% 0%;
height:100%;
width:22px;
}

#s7 {
background-image:url(images/s7.jpg);
background-repeat:no-repeat;
background-position: 100% 0%;
height:22px;
line-height:22px;
width:22px;
}

#s8 {
background-image:url(images/s8.jpg);
background-repeat:repeat-x;
background-position: 0% 0%;
height:22px;
line-height:22px;
width:100%;
}

#s9 {
background-image:url(images/s9.jpg);
background-repeat:no-repeat;
background-position: 0% 0%;
height:22px;
line-height:22px;
width:22px;
}

--------------------------------------------------------------------------------------
ie_format.css



/* aufklappmenü - CODE FÜR IE Vers. 6 */

.menu ul li a.hide, .menu ul li a:visited.hide {
display:none;
}
.menu ul li a:hover ul li a.hide {
display:none;
}

.menu ul li a:hover {
background-color:#405a00;
color:#fff;
text-decoration:none ;
border:solid 1px #000;

}
.menu ul li a:hover ul {
display:block;
position:absolute;
top:46x;
left:0;
width:206px;
}
.menu ul li a:hover ul li a {
display:block;
background-color:#7f9155;
color:#fff;
border:solid 1px #000;
line-height:40px;

}
.menu ul li a:hover ul li a ul {
visibility:hidden;
}
.menu ul li a:hover ul li a:hover {
background-color:#405a00;
color:#fff;
text-decoration:none ;
border:solid 1px #000;
}
.menu ul li a:hover ul li a:hover ul {
visibility:visible;
position:absolute;
left:206px;
top:0;
color:#fff;
}
.menu ul li a:hover ul li a:hover ul.left {
left:-206px;
}

--------------------------------------------------------------------------------------
menue.css



/*klapp-menü */

#all {
width:840px;
height:100%;
padding: 0px;
margin:0 auto;
text-align:center;
}

/* menue oben */

.menu {
width:100%;
height:40px;
background-color:#7f9155;
position:relative;
z-index:100;
}
.menu ul li a, .menu ul li a:visited {
display:block;
text-decoration:none;
color:#fff;
background-color:#7f9155;
font-family:verdana, sans-serif;
font-size: 12px;
font-variant:normal;
overflow:hidden;
width: 206px;
margin:1px 1px 0px 1px;
border:solid 1px #fff;
line-height:40px;
text-align:center;

}
.menu ul {
padding:0;
margin:0 auto;
list-style: none;
}
.menu ul li {
float:left;
position:relative;margin:0px 0px 0px 0px;
}
.menu ul li ul {
display: none;
}

/* specific to non IE browsers */
.menu ul li:hover a {
background-color:#405a00;
color:#fff;
text-decoration:none ;
border:solid 1px #fff;
margin:1px 1px 0px 1px;
}
.menu ul li:hover ul {
display:block;
position:absolute;
top:42px;
left:0;
width:206px;
}
.menu ul li:hover ul li a.hide {
background-color:#405a00;
color:#fff;
}
.menu ul li:hover ul li:hover a.hide {
background-color:#405a00;
color:#fff;
}
.menu ul li:hover ul li ul {
display: none;
}


/* farb-änderungen der aufklapp-untermenüs, zb seite 11 bis 14 */
.menu ul li:hover ul li a {
display:block;
background:#7f9155;
color:#CFD8BA;
font-style:italic;
border:solid 1px #000;
line-height:40px;

}

/* farb-änderungen nur eines einzelnen punktes der aufklapp-untermenüs, zb. seite 11*/
.menu ul li:hover ul li a:hover {
background-color:#9DAF72;
color:#fff;
text-decoration:none ;
border:solid 1px #000;}


/* =============================================================== */



/* menue unten */

#menu1 a, #menu1 a:visited , #menu1 a:active {display: block;
color:#7f9155;
font-size: 14px;line-height: 20px;
font-family: verdana,arial,helvetica, verdana, tahoma, sans-serif;
padding-left: 10px;padding-right: 10px; padding-bottom: 0px; padding-top:0px;
margin-left: 0px;margin-right: 0px;
height:20px;
line-height:20px;
text-align:center;
text-decoration:underline ;
background:transparent
}

#menu1 a:hover {color:#fff; text-decoration:none ;
background-color:#7f9155;
text-decoration:underline ;
}

/* =============================================================== */

/* allgemeine links im text */

a:link, a:visited, a:active{
font-size: 16px;line-height: 21px;
font-family: trebuchet ms,verdana,arial,helvetica, verdana, tahoma, sans-serif;
text-decoration:underline;color:#7f9155;}

a:hover{ text-decoration:none;background-color:#7f9155;
color:#fff;text-decoration:none;}

/* =============================================================== */
Beitrag29.03.2010 um 14:27 (UTC)    
Titel:

Hallo,
ersteinmal eine allgemeine Frage: Hast du Ahnung von HTML und CSS?
Wenn nicht wird es schwierig dieses Design auf den Baukasten für dich umzucoden.

Der Baukasten ist dazu da, den Umgang zu erleichtern, sprich das eigentliche Verwenden von HTML und CSS zu umgehen und es somit möglich für Jeden zu machen eine Homepage zu erstellen.

Natürlich kann man als Fortgeschrittener Benutzer auch HTML und CSS benutzen.

Eröffne ggf. unter folgendem Link einen Thread, falls du einen "Umcoder" für das Design brauchst.

http://www.homepage-baukasten.de/forum/viewforum.php?f=29

Grüße,
Mats
Beitrag29.03.2010 um 14:34 (UTC)    
Titel:

html hab ich plan aber css nicht.
also wenn man es umcoden muss da geht man doch kaputt dran.^^
ich versuch mal über den link was zu erreichen.
vielen dank für die schnelle antwort.

würd denn sagen
/erledigt
/close

ich mach ja n neuen woanders auf ^^
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de