300Mem: Layout 52

Layout 52 view

Myblog-Code:

<html>
<head>

<link href='http://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'>

<style type="text/css">

</style>

</head>

<body style="background-color: #dbd1e0; background-image: url('http://300memories.pytalhost.at/layouts/layout53bg.png'); background-repeat: repeat-x; ">
<img src="http://300memories.pytalhost.at/layouts/layout53.png" border="0">

<div style="position: absolute; top: 590px; left: 79px; width: 600px;">
<div class="header">
{PLACE_CONTENT}
</div>
</div>

<div style="position: absolute; top: 42px; left: 508px; width: 400px;">
<center>
<div class="navibox">
<ul id="navigation">
<li><a href="http://URL TEXTSEITE">Home</a></li>
<li><a href="http://URL TEXTSEITE">Owner</a></li>
<li><a href="http://URL TEXTSEITE">About the Site</a></li>
<li><a href="http://URL TEXTSEITE">Linkage</a></li>
<li><a href="http://URL TEXTSEITE">Stuff</a></li>
<li><a href="http://URL TEXTSEITE">Ressourcen</a></li>
<li><a href="http://300memories.pytalhost.at/">Designer</a></li>
</ul>
</div>
</center>
</div>

<div style="position: absolute; top: 590px; left: 690px; width: 248px;">
<div class="header">
<p class="h1"> Welcomemessage </p>
<font>Hier ist genug Platz für einen Willkommenstext. Du kannst deine Besucher willkommen heißen,
ihnen kurz etwas über deine Seite sagen, oder was auch immer du hier stehen haben willst, das ist ganz
dir überlassen.</font>
</div><br>

<br>

<div class="header">
<p class="h1"> Mainmenue </p>
<a href="http://deineSeite.de/" class="navi">Refresh</a>
<a href="http://deineSeite.de/" class="navi">Ask me</a>
<a href="http://deineSeite.de/" class="navi">Guestbook</a>
<a href="http://deineSeite.de/" class="navi">Affiliates</a>
<a href="http://deineSeite.de/" class="navi">Buttons</a>
<a href="http://deineSeite.de/" class="navi">Credits</a>

</div><br>

<br>

<div class="header">
<p class="h1"> Weitere Links </p>
<table width="100%"></tr>
<td width="50%">
<a href="http://deineSeite.de/" class="navi2">Hier</a>
<a href="http://deineSeite.de/" class="navi2">Kommen</a>
<a href="http://deineSeite.de/" class="navi2">Noch</a>
</td><td width="50%">
<a href="http://deineSeite.de/" class="navi2">Weitere</a>
<a href="http://deineSeite.de/" class="navi2">Links</a>
<a href="http://deineSeite.de/" class="navi2">Hin</a>
</td></tr></table>

</div>
</div>

</body>
</html>

HPBK-Code:

Text über dem Design

<div id="b">
<div id="Mein_Bild"></div>

<link href='http://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'>

<div id="header"><img src="http://300memories.pytalhost.at/layouts/layout53.png" usemap="#map" border="0"></img></div>

<div id="navi">
<center>
<div class="navibox">
<ul id="navigation">
<li><a href="http://URL TEXTSEITE">Home</a></li>
<li><a href="http://URL TEXTSEITE">Owner</a></li>
<li><a href="http://URL TEXTSEITE">About the Site</a></li>
<li><a href="http://URL TEXTSEITE">Linkage</a></li>
<li><a href="http://URL TEXTSEITE">Stuff</a></li>
<li><a href="http://URL TEXTSEITE">Ressourcen</a></li>
<li><a href="http://300memories.pytalhost.at/">Designer</a></li>
</ul>
</div>
</center>
</div>

<div id="navi2">
<div class="navibox2">
<p class="h1"> Welcomemessage </p>
<font>Hier ist genug Platz für einen Willkommenstext. Du kannst deine Besucher willkommen heißen,
ihnen kurz etwas über deine Seite sagen, oder was auch immer du hier stehen haben willst, das ist ganz
dir überlassen.</div></font><br>

<br>

<div class="navibox2">
<p class="h1"> Mainmenue </p>
<a href="http://deineSeite.de/" class="navi">Refresh</a>
<a href="http://deineSeite.de/" class="navi">Ask me</a>
<a href="http://deineSeite.de/" class="navi">Guestbook</a>
<a href="http://deineSeite.de/" class="navi">Affiliates</a>
<a href="http://deineSeite.de/" class="navi">Buttons</a>
<a href="http://deineSeite.de/" class="navi">Credits</a>

</div><br>

<br>

<div class="navibox2">
<p class="h1"> Weitere Links </p>
<table width="100%"></tr>
<td width="50%">
<a href="http://deineSeite.de/" class="navi2">Hier</a>
<a href="http://deineSeite.de/" class="navi2">Kommen</a>
<a href="http://deineSeite.de/" class="navi2">Noch</a>
</td><td width="50%">
<a href="http://deineSeite.de/" class="navi2">Weitere</a>
<a href="http://deineSeite.de/" class="navi2">Links</a>
<a href="http://deineSeite.de/" class="navi2">Hin</a>
</td></tr></table>

</div>
</div>

CSS-Code ohne Style-Tags:

body {

overflow-x: hidden;
}

a:link {
color: #2d7583;
text-decoration:none;
text-transform: uppercase;

}
a:visited {color: #2d7583;
text-decoration:none;

}

a:active {color: #2d7583;
text-decoration:none;

}
a:hover {color: #46b6cc;

}

#navigation li {
display: inline;
list-style-type: none;
}

#navigation a {
font-family: 'Amatic SC', cursive;
color: #bfadc5;
font-size: 28px;
padding-top: 10px;
text-decoration: none;
text-transform: none;
padding: 6px 13px;
letter-spacing: 0px;
text-shadow: #ffffff 1px 1px 0px;

}

#navigation a:hover {
font-family: 'Amatic SC', cursive;
color: #f4cfd8;
font-size: 28px;
padding-top: 10px;
text-decoration: none;
text-transform: none;
padding: 6px 13px;
letter-spacing: 0px;
text-shadow: #ffffff 1px 1px 0px;
}

A.navi:link, A.navi:active, A.navi:visited {
text-align: center;
text-transform:uppercase;
font-family: Arial;
font-size : 12px ;
letter-spacing: 0px;
display: block;
color: #ffffff;
line-height: 18px;
margin-top: 1px;
background-color: #dbd1e0;
border-bottom: 1px solid #ccc3d1;
text-shadow: 1px 1px #beb6c3;

}

A.navi:hover {
background-color: #e3d9e8;
cursor:url('http://un0heard.funpic.de/Bilder/Cursor/1schwarz.cur');
}

A.navi2:link, A.navi2:active, A.navi2:visited {
display: block;
font-family: Arial;
font-size: 9px;
margin-bottom: 1px;
background-color: #dbd1e0;
text-transform: uppercase;
color: #474747;
text-align: center;
line-height: 17px;
text-shadow: #f7f7f7 1px 1px 1px;
}

A.navi2:hover {
display: block;
background-color: #e3d9e8;
cursor:url('http://un0heard.funpic.de/Bilder/Cursor/1schwarz.cur');
}

b, strong{
   color: #443050;

}

i, em{
   color:#7b6d82;

}

u{
color: #000000;
text-decoration: underline;

}

s, strike{
   color:#74a6de;
}

font {
color: #877d8a;
letter-spacing: 0px;
font-family: Verdana;
text-align: left;
font-size: 11px;
line-height: 14px;
text-shadow: 1px 1px #ffffff;

}

.h1{
display: block;
background-image: url('http://300memories.pytalhost.at/layouts/layout53headline.png');
font-family: Century Gothic;
color: #000000;
font-size: 15px;
line-height: 24px;
text-align: center;
letter-spacing: -1px;
margin-bottom: 2px;
text-transform: uppercase;
text-shadow: 1px 1px #ffffff;
}

* { margin: 0; padding: 0; }

.box {
-moz-box-shadow: 1px 1px 3px #a4a4a4; /Mozilla-basierte Browser (z.B. Firefox)/
-webkit-box-shadow: 1px 1px 3px #a4a4a4; /WebKit-basierte Browser (z.B. Safari/Chrome)/
box-shadow: 1px 1px 3px #a4a4a4; /CSS3 Standard/
margin-bottom: 10px;
padding: 10px;
background-color: #dbd1e0;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 3px;
width: 75%;
color: #212121;
letter-spacing: 0px;
font-family: Tahoma;
text-align: justify;
font-style: italic;
font-size: 11px;
text-shadow: 1px 1px #ececec;
margin: 8px;
}

TEXTAREA {
margin-bottom: 10px;
padding-left: 3px;
background-color: #ffffff;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 3px;
width: 75%;
color: #646464;
letter-spacing: 0px;
font-family: Tahoma;
text-align: justify;
font-size: 11px;
width: 300px;
height: 110px;
border: 0px;

}

INPUT {
margin-bottom: 10px;
padding-left: 3px;
background-color: #ffffff;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 3px;
color: #646464;
font-family: Tahoma;
text-align: justify;
font-size: 10px;
width: 120px;
height: 20px;
}

.site {
font-family: 'Lobster', cursive;
color: #6c6c6c;
font-size: 40px;
text-decoration: none;
text-shadow: #ffffff 1px 1px;
}

.navibox2 {
-moz-box-shadow: 0px 0px 15px #c2bac7;
background-color: #ebe3ee;
-webkit-box-shadow: 0px 0px 15px #c2bac7;
box-shadow: 0px 0px 15px #c2bac7;
padding: 8px;
text-align: left;
margin-bottom: -25px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-khtml-border-top-left-radius: 5px;
-khtml-border-top-right-radius: 5px;
-khtml-border-bottom-left-radius: 5px;
-khtml-border-bottom-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}

.navibox {
background-image: url('http://300memories.pytalhost.at/layouts/naviinbox20.png');
-webkit-border-top-left-radius: 9px;
-webkit-border-top-right-radius: 9px;
-webkit-border-bottom-left-radius: 9px;
-webkit-border-bottom-right-radius: 9px;
-khtml-border-top-left-radius: 9px;
-khtml-border-top-right-radius: 9px;
-khtml-border-bottom-left-radius: 9px;
-khtml-border-bottom-right-radius: 9px;
-moz-border-radius-topleft: 9px;
-moz-border-radius-topright: 9px;
-moz-border-radius-bottomleft: 9px;
-moz-border-radius-bottomright: 9px;
border-top-left-radius: 9px;
border-top-right-radius: 9px;
border-bottom-left-radius: 9px;
border-bottom-right-radius: 9px; padding: 8px;
}

#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#300memories_content {display: none;}
#nav{display: none;}
div.header{display: none;}
h2#title{display: none;}

body {
overflow-x: hidden;
background-color: #dbd1e0;
background-repeat: repeat-x;
background-image: url('http://i47.tinypic.com/6p22de.png');

}

*{ padding: 0; margin: 0; }

#Mein_Bild {
margin: 0px;
margin-top: -106px;
width: 1024px;
height:768px;
border:0px;}

#content {
-moz-box-shadow: 0px 0px 15px #c2bac7;
background-color: #ebe3ee;
-webkit-box-shadow: 0px 0px 15px #c2bac7;
box-shadow: 0px 0px 15px #c2bac7;
padding: 8px;
text-align: left;
margin-bottom: -25px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-khtml-border-top-left-radius: 5px;
-khtml-border-top-right-radius: 5px;
-khtml-border-bottom-left-radius: 5px;
-khtml-border-bottom-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
position: absolute;
overflow-x: hidden;
top: 690px; left: 79px; width: 580px;
overflow: auto;
color: #877d8a;
letter-spacing: 0px;
font-family: Verdana;
text-align: left;
font-size: 11px;
line-height: 14px;
text-shadow: 1px 1px #ffffff;

text-align: justify;
}

#b {
background-repeat: repeat-x;
height: 100px;
background: url('http://i52.tinypic.com/53wgag.jpg'); }

#header{
position: absolute;
left:0px;
top:100px;
border: 0px solid #ffffff;
overflow:auto;}

#navi{
position: absolute;
top: 142px; left: 508px; width: 400px;
}

#navi2 {
position: absolute;
top: 690px; left: 690px; width: 248px;
}

Diese Webseite wurde kostenlos mit Homepage-Baukasten.de erstellt. Willst du auch eine eigene Webseite?

Gratis anmelden