zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hilfe bei CSS Desing Umsetzung.

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 26.02.2010, 23:47
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.02.2010
Beiträge: 4
Frosti1986 befindet sich auf einem aufstrebenden Ast
Standard Hilfe bei CSS Desing Umsetzung.

Hallo,

ich habe vor ca einer Woche angefangen mich ins CSS ein zu arbeiten, habe bereits schon viele Videos gesehen und auch schon sehr viel über CSS gelesen aber irgendwie bin ich noch nicht ganz schlau draus gewurden.

Ich habe versucht ein von mir erstelltes Design mit CSS umzusetzen aber irgendwie ist mir ein fehler unterlaufen oder ich habe etwas falsch gemacht, ich weis es erlich gesagt nicht.

Würde mich freuen wenn sich jemand den Design Aufbau und die CSS anschauen würde und mir ein paar Tipps geben könnte wie ich es richtig machen könnte oder wo der fehler ist.

Hier das Design.
Spiele Portal

Gruß
Denny
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 26.02.2010, 23:54
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.977
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

ein Tipp ist die Fehlerkonsole, die ziegt auch CSS Fehler an. Es sind zwei bei dir.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 27.02.2010, 00:02
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.02.2010
Beiträge: 4
Frosti1986 befindet sich auf einem aufstrebenden Ast
Standard

Die Fehlerkonsole zeigt viel an.
Wenn ich auf Fehler klicke kommt nur eine Leere Seite.
Mit Zitat antworten
  #4 (permalink)  
Alt 27.02.2010, 00:54
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.372
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Es sind 2 (!) Warnungen die in der Fehlerkonsole angzeigt werden, des weiteren besteht deine Website nur aus folgendem:
Code:
bla

bla

 

bla

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

bla
Soll heißen: du hast nirgends Texte ausser die "bla" dummys.

lerne anhand vom little Boxes Webbüchlein
Teil 1 kostenlos online lesen - Little Boxes - Webseiten gestalten mit HTML und CSS
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
  #5 (permalink)  
Alt 27.02.2010, 01:49
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.02.2010
Beiträge: 4
Frosti1986 befindet sich auf einem aufstrebenden Ast
Standard

Richtig, die "bla" dummys habe ich nur reingemacht damit man weis wo mal text rein soll.

ich habe auch noch keine text bezeichnungen im CSS code weill die für mich einfacher zu handhaben und schon bekannt sind.
Mit Zitat antworten
  #6 (permalink)  
Alt 27.02.2010, 12:54
Benutzerbild von Carolin
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.11.2007
Beiträge: 232
Carolin wird schon bald berühmt werden
Standard

Für 1 Woche ist das ja schon mal was.

Ein typischer Anfängerfehler sind aber die vielen divs. In html gibt es für die Auszeichnung von Inhalt viele Elemente mit logsicher Bedeutung.

Überschriften, sortierte und unsortierte Listen, Absätze, usw.

Informier dich in dem Zusammenhang über Listen für Navigationsmenüs. Wenn du dein Navigationsmenü mit Grafiken gestalten möchtest, dann schau mal was du zum Thema Image-Replacement findest.


Weiterhin gibt es Blockelemente und Inlineelemente. Ganz allgemein gilt die Regel, dass Inline-Elemente innerhalb von Blockelementen zulässig sind, umgekehrt aber nicht. Wenn du innerhalb eines Inlineelementes ein weiteres Element benötigst, (z.B. um auf einen Sprachunterschied aufmerksam zu machen) kann man das Element <span> benutzen.
Um konkret zu werden, ein div innerhalb eines a geht nicht.

Nächster Punkt sind die Bezeichner. Neben den ID's gibt es auch Klassen. Eine ID ist ein eindeutiger Bezeichner und darf pro Dokument nur 1 x verwendet werden. Klassen hingegen dürfen mehrfach in einem Dokument verwendet werden.

Das sind die Fehler, die dir auch der Validator zeigt:
[Invalid] Markup Validation of http://www.besucher-24h.net/ - W3C Markup Validator

LG Carolin
Mit Zitat antworten
  #7 (permalink)  
Alt 27.02.2010, 13:35
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.02.2010
Beiträge: 4
Frosti1986 befindet sich auf einem aufstrebenden Ast
Standard

Vielen dank, die fehler hatte ich schon im W3C Markup Validator gesehen wuste aber nicht mit anzufangen.

Das habe ich auch nicht gewust das ein div innerhalb eines a nicht geht.
Mein Problem war das ich für jeden Navi punkt (home, news usw..) ein anderes Bild brauchte deswegen habe ich das mit div´s gemacht.

Wenn ich das jetzt richtig verstanden habe soll ich stat der ID´s Klassen verwenden?

Werde mich heute abend nochmal ransetzen und alles neu aufbauen.
Nur habe ich noch nicht rausgefunden wie ich das mit <li> machen soll.

Muss ich für jede Grafik im header menü eine eigene Klasse zuweisen?

Also so z.b.
HTML-Code:
<li class="home"><a href="#"></a></li>
Oder muss ich die Grafik in die <li> packen?
So z.b.
HTML-Code:
<li><a href="#"><img src="http://xhtmlforum.de/images/img1.jpg" alt="" /></a><li>
Gruß
Denny
Mit Zitat antworten
  #8 (permalink)  
Alt 27.02.2010, 14:08
Benutzerbild von Carolin
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.11.2007
Beiträge: 232
Carolin wird schon bald berühmt werden
Standard

Hier siehst du 2 Beispiele für eine Navigation.

CSS Navigation mit Liste
9.1 Einfache horizontale Navigation: display: inline - Little Boxes - Webseiten gestalten mit HTML und CSS

Das würde ich an deiner Stelle erst mal versuchen umzusetzen, ohne die Grafiken. Danach kannst du dich mit dem schon angesprochenen Image Replacement vertraut machen.

Übersicht: Image-Replacement-Techniken ? Artikel von Jens Meiert

Das hat im Gegensatz zu deiner Variante den Vorteil, dass die Seite auch ohne die Grafiken zugänglich und verständlich ist.

Es spricht nichts gegen die Verwendung von ID's. Allerdings darf jede ID nur 1 x vorkommen. Das heißt, ein <div id="contentwrap">...</div> ist ok. Wenn du aber 100 Links hast, die alle die gleiche Zuweisung bekommen sollen, dann verwendet man eine Klasse.

LG Carolin
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 13:25
Hilfe bei CSS Navigation trimalchio CSS 7 10.01.2011 14:13
Benötige Hilfe bei Umsetzung eines Layouts accessoire CSS 1 07.04.2008 10:39
Hilfe bei gesamten CSS Layout mexxat CSS 0 22.08.2007 14:40
CSS mit CSS Seiten verlinken !!! BRAUCHE HILFE !!!! beavis-2005 CSS 2 16.01.2006 18:10


Alle Zeitangaben in WEZ +2. Es ist jetzt 16:52 Uhr.