Hallo !
Ich habe mich mal heute hingesetzt und ein komplett neues Grund Gerüst eines Styles entworfen und würde gerne wissen ob ihr es besser/mittel/schlechter als mein momentaniges Style findet !Der Grund warum ich das gemacht ist weil meine momentanige Page wirklich zusammen gewürfelt und unüberischtlich ist und ich das jetzt irgendwie Blöd find soooo.....(schwer zu sagen)
Also hier ist mein momentaniges Style:
http://www.freakmartin.dl.am
und hier ist der neue Style Code (Wird alles noch farblich angepasst: Banner,Menü....)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css"/>
<title>Style Versuche</title>
<style type="text/css">
body{
margin:0px;
padding:0px;}
.box1, .box5{
background:silver;
border:1px solid black;
margin:0px;
padding:0px;
height:60px;}
.box2{
background:gainsboro;
padding:3px;
border:1px solid black;
width:178px;
height:400px;
margin-left:5px;
position:absolute; left:0px;top:90px;}
.box3{
padding:4px;
border:1px solid black;
margin:0 140px 0 140px;
padding:50px 50px 0 50px;}
.box4{
background:gainsboro;
padding:3px;
border: 1px solid black;
width:178px;
height:400px;
margin-right:5px;
position:absolute; right:0px;top:90px;}
p
{
font-family:Verdana, Helvetica, sans-serif;
}
+++++++++++++++++
Beginn des Menü`s
+++++++++++++++++
#navcontainer {width: 177px; text-align: left;
border: 1px solid black;
border-bottom: none;
margin-bottom: 2em;}
#navcontainer ul {margin: 0; padding: 0;
list-style-type: none;
text-indent: 20px;letter-spacing: 1px;}
#navcontainer li {list-style-image: none;
margin:0; border-bottom: 1px solid black;}
#navcontainer a {display: block;
width: 177px;height: 22px;
font: bold 12px/22px Verdana, Arial,
Helvetica, sans-serif; }
#navcontainer a:link, #navcontainer a:visited {
background: url(MenueBeispiel.gif);
color: #CC6600;text-decoration: none;
padding-bottom: 0;}
#navcontainer li a:hover {
background: url(MenueBeispiel.gif)
/* hier wird das Image verschoben */
0px -22px no-repeat;
color: #fff;text-decoration: none;}
#navcontainer li a#current {
background: url(MenueBeispiel.gif)
/* hier wird das Image verschoben */
0px -22px no-repeat;
color: #fff;text-decoration: none;}
</style>
</head>
<div class="box1">
<center>Hier ist der Banner Bererich (wird vllt. noch Breiter)<center>
</div>
<div class="box2">
<div id="navcontainer">
<ul>
[*][url='#']Home[/url]
[*][url='#']Menüpunkt 1[/url]
[*][url='#']Menüpunkt 2[/url]
[*][url='#']Menüpunkt 3[/url]
[*][url='#']Menüpunkt usw.[/url]
[/list]
</div>
<div id="navcontainer">
<ul>
[*][url='#']Home[/url]
[*][url='#']Menüpunkt 1[/url]
[*][url='#']Menüpunkt 2[/url]
[*][url='#']Menüpunkt 3[/url]
[*][url='#']Menüpunkt usw.[/url]
[/list]
</div>
</div>
<div class="box3">
„Lorem ipsum dolor sit amet, consectetur adipisici elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.“
„Lorem ipsum dolor sit amet, consectetur adipisici elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.“
„Lorem ipsum dolor sit amet, consectetur adipisici elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.“
„Lorem ipsum dolor sit amet, consectetur adipisici elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.“
„Lorem ipsum dolor sit amet, consectetur adipisici elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.“
</div>
<div class="box4">
<div id="navcontainer">
<ul>
[*][url='#']Home[/url]
[*][url='#']Menüpunkt 1[/url]
[*][url='#']Menüpunkt 2[/url]
[*][url='#']Menüpunkt 3[/url]
[*][url='#']Menüpunkt usw.[/url]
[/list]
</div>
<div id="navcontainer">
<ul>
[*][url='#']Home[/url]
[*][url='#']Menüpunkt 1[/url]
[*][url='#']Menüpunkt 2[/url]
[*][url='#']Menüpunkt 3[/url]
[*][url='#']Menüpunkt usw.[/url]
[/list]
</div>
</div>
<div class="box5">
<p style="padding:1px">
<center><font size="-1">Copyright by Martin</font></center>
</p>
</div>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
</body>
</html>
Alles anzeigen
Freue mich über jeden Kommentar!