Neuaufbau einer Hompage

[Eragon-02]

h1 fehlt noch

Code: Alles auswählen

body {
margin:0;
font:12px Georgia;
color:#0B615E;
background:url("http://file2.npage.de/011827/41/bilder/bg1001.jpg") 50% 0 #151921 fixed;
}

h2 {
color : #FF0000;
font-family : verdana;
font-size : 22px;
}
h3 {
color : #696969;
font-family : verdana;
font-size : 20px;
}
a:link {
  color : #FF0000;
  text-decoration : none;
}
a:visited {
  color : #FF0000;
  text-decoration : none;
}
a:active {
  color : #FF0000;
  text-decoration : none;
}
a:hover {
  color : #F0FC6C;
  text-decoration : underline;
}

#ev_bg {
background:url("http://file2.npage.de/011827/41/bilder/ev_bg.png") repeat-y;
width:1064px;  
margin:0px auto;
}

#everything {
width:1000px;
margin:0 32px;  
background:url("http://file2.npage.de/011827/41/bilder/parchment-light2.jpg");
border:1px Georgia;
border-width:0px 0px;
}

#header {
height:176px;
background:url("http://file2.npage.de/011827/41/bilder/wow_header.gif") right no-repeat;
padding:0 20px;
}

#header h1 {
padding-top:115px;
margin:0;
color: #333333;
}

#middle {
clear:both;
background:url("../bilder/border-red.gif") repeat-x;
padding:20px 10px;
}  
  
#left_column {
width:160px;
float:left;
}

.navigation a {
background:url("http://file2.npage.de/011827/41/bilder/13.png") no-repeat;
width:150px;
height:50px;
display:block;
padding-left:22px;
margin:2px 0;
font-size:14px;
font-family : Georgia;
color: #333333;
text-decoration:none;
line-height:45px;
}

.navigation a:hover {
background-position:0 bottom;
font-family : Georgia;
color: #0101DF;
}

kann ich ja h2 nehmen und da h1 ihnschreiben ?

so ihr ?

Code: Alles auswählen

h1 {
text-align : center;
color : #FF0000;
font-family : verdana;
font-size : 22px;
}

[Eragon-02]

okay so zieht jezt meine ganze css Datei aus

Code: Alles auswählen

body {
margin:0;
font:12px Georgia;
color:#0B615E;
background:url("http://file2.npage.de/011827/41/bilder/bg1001.jpg") 50% 0 #151921 fixed;
}

h1 {
text-align : center;
color : #333333;
font-family : verdana;
font-size : 22px;
}
h2 {
color : #FF0000;
font-family : verdana;
font-size : 22px;
}
h3 {
color : #696969;
font-family : verdana;
font-size : 20px;
}
a:link {
  color : #FF0000;
  text-decoration : none;
}
a:visited {
  color : #FF0000;
  text-decoration : none;
}
a:active {
  color : #FF0000;
  text-decoration : none;
}
a:hover {
  color : #F0FC6C;
  text-decoration : underline;
}

#ev_bg {
background:url("http://file2.npage.de/011827/41/bilder/ev_bg.png") repeat-y;
width:1064px;  
margin:0px auto;
}

#everything {
width:1000px;
margin:0 32px;  
background:url("http://file2.npage.de/011827/41/bilder/parchment-light2.jpg");
border:1px Georgia;
border-width:0px 0px;
}

#header {
height:176px;
background:url("http://file2.npage.de/011827/41/bilder/wow_header.gif") right no-repeat;
padding:0 20px;
}

#header h1 {
padding-top:115px;
margin:0;
color: #088A08;
}

#middle {
clear:both;
background:url("../bilder/border-red.gif") repeat-x;
padding:20px 10px;
}  
  
#left_column {
width:160px;
float:left;
}

.navigation a {
background:url("http://file2.npage.de/011827/41/bilder/13.png") no-repeat;
width:150px;
height:50px;
display:block;
padding-left:22px;
margin:2px 0;
font-size:14px;
font-family : Georgia;
color: #333333;
text-decoration:none;
line-height:45px;
}

.navigation a:hover {
background-position:0 bottom;
font-family : Georgia;
color: #0101DF;
}

.navigation2:link, A.menulink:visited, A.menulink:active {
background:none;
width:150px;
height:28px;
display:block;
padding-left:22px;
margin:2px 0;
font-size:14px;
font-family : Georgia;
color: #333333;
text-decoration:none;
line-height:28px;
}

a.navigation2:hover {
background-position:0 bottom;
font-family : Georgia;
color: #0101DF;
}

#middle_column {
float:left;
width:78%;
margin:0px 20px;
}

.post {
background:url("../bilder/parchment-light3.jpg");
border:1px solid #545454;
margin-bottom:35px;
line-height:18px;
}

.post h1 {
background:url("http://file2.npage.de/011827/41/bilder/title-gold_2.png") repeat-x #0d2368;
padding:2px 10px;
margin:0;
font-size:15px;
font-family : Georgia;
color:#333333;
}

.post_body {
padding:5px 15px;
}

ul {
margin:20px; padding:10px;
}

li {
list-style:none;
background:url("../bilder/bullet.gif") 0 5px no-repeat;  
padding-left:30px; line-height:25px;  
}

#right_column {
width:25%;
float:left;
}

.box {
background:url("../bilder/parchment-light3.jpg");
border:1px solid #545454;
margin:0;
padding:10px;
}

#footer {
clear:both;
padding:20px
}

#subnav { margin:10px 0;}  
#subnav a { color:#7A0C0C; }
#subnav a:hover { color:#E51414 }

.copyright {
font-size:10px;
color:#666666;
}

.copyright a{
text-decoration:none;
color:#666666;
}

[goefi-chiangmai]

h1 fehlt noch

Nein fehlt nicht, habe ich hier Beschrieben: http://www.npage-hilfe.de/p28687-neuauf ... tml#p28687
Der wird nicht funktionieren wenn ihn da oben reinmachst weil der DIV: "#middle_column" In dem anderen drinn ist und so das h1 nimmt.

Wenn drei Titelarten nicht reichen, mach halt noch ein h4

wenn wir dann zum Nächten schritt gehen können
würde ich gern wie auf ihrer Seite oben
wenn das noch geht ich denke schon das Mann das noch mit ein bauen kann
und zwar die navi oben noch wo du stehen hast

Wird nicht gehen!
Weil wir ja ein Bestehendes Design Umbauen, da hättest eines Auslesen sollen mit einer Navi oben!
Du hast aber zusätzlich Navi unten, da kannst ja links wie Impressum etc. rein machen

[Eragon-02]

ihr gibs noch ein parr css datein aber nur da weiß ich nicht welche ich da nehmen müßte welche am besten wer

http://designpatch.npage.de/designvorla ... ctype.html

Habe eins gefunden ihr
http://npage-hilfe-vorlagen.npage.de/standart.html

und zwar Designvorlagen Muster 002
http://npage-hilfe-vorlagen.npage.de/design002.html

ihr das wer die css datei

Code: Alles auswählen

h1 {
  font-weight : bold;
  font-family : Arial, Helvetica, sans-serif;
  font-size : 22px;
  color : #000000;
  text-align : left;
  text-decoration : none;
}
h2 {
  font-family : Arial, Helvetica, sans-serif;
  font-size : 22px;
  color : #000000;
  text-align : left;
  font-weight : normal;
}
h3 {
  font-family : Arial, Helvetica, sans-serif;
  font-size: 18px;
  color : #001244;
  text-align : left;
  font-weight : bold;
}
h4 {
  font-weight : bold;
  font-family : Arial, Helvetica, sans-serif;
  font-size : 16px;
  color : #001244;
  text-align : left;
 }
a:link {
  font-family : Arial, Helvetica, sans-serif;
  color : #0000FF;
  font-size : 16px;
  font-weight : normal;
  text-decoration : none;
}
a:visited {
  font-family : Arial, Helvetica, sans-serif;
  color : #0000FF;
  font-size : 16px;
  font-weight : normal;
  text-decoration : none;
}
a:active {
  font-family : Arial, Helvetica, sans-serif;
  color : #0000FF;
  font-size : 16px;
  font-weight : normal;
  text-decoration : none;
}
a:hover {
  font-family : Arial, Helvetica, sans-serif;
  color : #FF0000;
  font-size : 16px;
  font-weight : normal;
  text-decoration : underline;
}
textarea {
  font-weight : normal;
  color : #000000;
  font-size : 12px;
  font-family : Arial, Helvetica, sans-serif;
  background-color : #5985ff;
  border : dashed 1px #1738dd;
}
body {
  font-size : 16px;
  font-family : Arial, Helvetica, sans-serif;
  color : #001244;
  font-weight : normal;
  text-align : left;
  width : 100%;
  background-color : #5985ff;
 }
#aussen {
  width : 1012px;
  margin : auto;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/mitte_002.jpg);
  background-repeat : repeat-y;
 }
#header {
  height : 230px;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/oben_1_002_c.jpg);
  background-repeat : no-repeat;
 }
#headernavi {
  height : 52px;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/oben_2_002.jpg);
  background-repeat : no-repeat;
 }
#headernavibox {
  text-align : center;
  width : 100%;
  height : 30px;
  line-height : 30px;
  margin-left : 28px;
  background-color : transparent;
}
 A.menuoben:link, A.menuoben:visited, A.menuoben:active {
  display : block;
  width : 132px;
  height : 24px;
  line-height : 24px;
  text-align : center;
  text-decoration : none;
  font-family : Arial, Helvetica, sans-serif;
  font-size : 16px;
  color : #FFFF00;
  background-color : #0000FF;
  margin-left : 0px;
  border-style : dotted;
  border-width : 1px;
  border-color : #FFFF00;
 }
 A.menuoben:hover {
  border-color : transparent;
  color : #FF0000;
  background-color : transparent;
 }
#Navigation {
  float : left;
  width : 171px;
  text-align : left;
  padding-left : 15px;
  background-color : transparent;
}
#menu1 {
  float : right;
  width : 155px;
  text-align : center;
  background-color : transparent;
  margin-right : 5px;
}
#menu2 {
  float : right;
  width : 155px;
  text-align : center;
  background-color : transparent;
  margin-right : 5px;
}
.navioben {
  text-align : right;
  color : #000000;
  font-weight : bold;
  height : 58px;
  line-height : 80px;
  margin-top : 4px;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/navi_oben_2.gif);
}
.navimitte {
  text-align : center;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/navi_mitte_2.gif);
}
.naviunten {
  height : 13px;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/navi_unten_2.gif);
}
 A.menulink:link, A.menulink:visited, A.menulink:active {
  display : block;
  width : 132px;
  height : 24px;
  line-height : 24px;
  text-align : center;
  text-decoration : none;
  font-family : Arial, Helvetica, sans-serif;
  font-size : 16px;
  color : #FFFF00;
  background-color : #0000FF;
  margin-left : 8px;
  border-style : dotted;
  border-width : 1px;
  border-color : #FFFF00;
 }
 A.menulink:hover {
  border-color : #0000FF;
  color : #FF0000;
  background-color: transparent;
 }
#main {
  float : right;
  width : 760px;
  margin-top : 1px;
  margin-right : 25px;
  padding-left : 1px;
  padding-right : 10px;
  Padding-bottom : 10px;
 }
#footer {
  width : 100%;
  height : 60px;
  line-height : 25px;
  color : #000000;
  font-weight : normal;
  text-align : center;
  background-color : transparent;
  background-image : url(http://file1.npage.de/008602/46/bilder/unten_002.jpg);
  background-repeat : no-repeat;
}
A.menufoot:link, A.menufoot:visited, A.menufoot:active {
  color : #FFBF00;
  text-decoration : none;
}
A.menufoot:hover {
  color : #FFFF99;
  text-decoration : none;
}
.clear {
  clear : both;
}

da fehlt mir aber der Header noch da kann ich ja nicht mein nehmen und die css von der andern

[Jasko]

da fehlt mir aber der Header noch da kann ich ja nicht mein nehmen und die css von der andern

Hier will ich mich noch mal zu Wort melden.

Also eins vor weg, ein CSS ist ein Top Marken Massanzug, den kann man nur den jenigen anziehn dessen Masse man genomen hat. Man koennte den Anzug auch selbst anziehn aber dan zwickt der und drueckt und man muss in wieder anpassen, also Eine CSS aus einer Design Vorlage fuer eine zweite zu nutzen ist nonsens, man kann fuer einzellne elemente sich was abschauen aber das ganze ist tabu.

[Jasko]

Wie weit seid ihr hier, wenn du willst Eragon koennen wir heute etwas weiterarbeiten am Design.

MFG

[Jasko]

OK wie ich sehe bist du weit gekommen, was mir aber gleich aufgefallen ist: Das ist die Grafick die am Rand links und rechts zu sehen ist, diese wiederholt sich ja nach unten dabei faehllt auf das sie nicht dafuer gemacht ist den man sieht sofort die schnitstelle, daher mein Tip mache die grafick so das das ende in den anfang uebergeht so sind schnittstellen zu vermeiden, ist zwar kein Code aber ein wichtiges Detail, und bekanntlich versteckt sich dort der Wurm

OK, schreibe bitte hier rein was Du als naechstes an deiner Seite aendern, anpassen oder verbessern willst und ich schreibe dir die Tipps und antworten sobald ich kann.

MFG

[Eragon-02]

du meinst diese Ränder Links Und Rechts



http://www.abload.de/img/unbenanntldu4p.jpg

ja und wie bekomme ich das ihn ?

[Eragon-02]

Habe schon verschiedene Größen durch vom Bild und das Bild gedreht und dann noch mal neu hochgeladen aber bekomme den Rand nicht weg

[Jasko]

Nein eigentlich meinte Ich die grauen Raender und nicht diese, aber auch fuer diese gibt es Loesungen, den diese4 sollten rechts und links in einander uebergehen, oder man macht die so das der Hintergrund nicht widerholt wird dafuer aber der Hintergrund in eine Hintergrundfarbe uebergeht. So habe ich es auf meiner DEMO Seite gemacht. Aber schu dir nur den Hintergrund an, das vorne ist veraltet da du ja auf deiner HP das alles schon angepasst hast.

Aber die besste loessung waere eine Frabe als hintergrund oder ein kacheldesign, desweiteren kan man mit farbe und schatten arbeiten, in dem man den Hintergrund eine farbe gibt und als Hintergrund ein Bild das der Farbe bur schatten verleit.

Mit den graficken muss man etwas rumexperiementieren um es richtig hinzubekommen, aber machen wir uns mal an die arbeit. Ich mache mal zwei drei versionen des Hintergrunds und stelle diese hier rein.