|
|||
CSS für totale Anfänger
Hallo,
Ich möchte meine erste eigene Webseite coden. Dabei möchte ich gleich mit XHTML und CSS arbeiten und nicht erst mit Tabellen anfangen. Da es mein erster Versuch ist, eine Seite zu schreiben, ist mir in Sachen CSS noch vieles unschlüssig. Mein Problem ist dabei, dass die Dinge einzeln zwar verstehe, aber es nicht in ein Gesamtpaket bekomme. Ich schreib einfach mal auf, was ich mir gedacht habe, vielleicht kann mir jemand helfen Es soll ein zwei Spalten-Layout werden; links die Navigation, rechts der Inhalt. Kann jemand einen guten Wert in Pixeln für die Navigationsbreite und den Inhalt sagen, damit es bei 800x600 passt? Über die Navigation und den Inhalt kommt ein Header, 760x150 px. Unter diesem Header sollte eine kleine Trennlinie hin, doch wie lässt sich das in der CSS-Datei realisieren? Dann habe ich noch das Problem, dass der Text über den Rand hinausgeht. Dabei soll er nur innerhalb des Inhaltsbereiches bleiben. Was muss ich da genau machen? Ein weiteres Problem ist die Position des "Gesamtpakets" bei einer höheren Auflösung als 800x600. Wie macht man es, dass es zentriert steht? Ich hoffe, ihr lacht nicht alzu sehr über meine totalen Anfänger-Fragen |
Sponsored Links |
|
||||
Re: CSS für totale Anfänger
Zitat:
Du brauchst auf jeden Fall die Float-Eigenschaft und evtl. auch faux-columns. (Guck mal im oben verlinkten XHTMLwiki unter den dortigen FAQs). Zitat:
Zitat:
Zitat:
|
Sponsored Links |
|
|||
Also ob Liquid oder nicht sollte wohl jeder je nach Art des Projektes selbst entscheiden. Man kann nicht pauschal sagen, dass fixe Breiten schlecht sind - für Anfänger ist es auf jeden Fall einfacher damit zu arbeiten.
Beim Zentrieren musst du dem body trotzdem noch ein "text-align: center" geben (für IE 5.x), welches du später im Wrapper, also in dem 760px breiten <div>, einfach wieder aufhebst.
__________________
Gruß, Sebastian |
|
|||
Re: CSS für totale Anfänger
Sorry, dass ich mich jetzt erst wieder melde
Ich finde das mit den Pixeln besser. Bei Auflösungen von 800x600 und 1024x780 mögen Prozente sinnvoll sein, aber ich habe eine Auflösung von 1280x800 und da sieht es mit Prozent nicht so toll aus. Zitat:
Das mit dem Zentrieren klappt noch nicht. Setzt man margin:0 auto; zum html? Und wie hebt man text-align:center wieder auf? |
|
||||
habs bisher immer so gehandhabt:
Code:
body { ... text-align: center; ... } wrapper { ... margin: 10px auto; width: 760px; text-align: left; ... }
__________________
Gruss Dieter Vegetarier essen meinem Essen das Essen weg. Und unsere Norweger sind reine Karnivoren. selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS |
|
|||
Vielen Dank für die Hilfe
Leider klappt das nicht so ganz wie ich es mir vorstelle. Ich habe mal ein Onlinebeispiel. http://www.talesemblem.de/beispiel.html Eigentlich möchte ich ja gerne, dass das Gesamtpaket, also der ganze Inhalt zentriert steht und nicht vereinzelte Teile. IE6 stellt jetzt alles untereinander. Wenn euch auch andere Fehler auffallen, dann sagt es bitte. Auch was man besser machen könnte. |
|
||||
um das mit float und clear zu verstehen, solltest du selbst mal rumexperimentieren
eigentlich ist das ganz einfach. nur der ie ist halt evtl. zu blöd dazu, aber darum würde ich mich jetzt nicht kümmern es gibt zwei sorten elemente: inline und block bilder (<img>) sind grundsätzlich inline-elemente das heißt, wenn du in einem text ein bild einfügst, dann ist die zeile, in dem das bild ist, so hoch wie das bild, plus unterlänge (zB soviel, wie das kleine g nach unten übersteht). das bild sitzt dann richtigerweise auf der grundlinie! das wird oft vergessen. (@board: Macht der IE das falsch?) http://de.wikipedia.org/wiki/Bild:Ty...e_Begriffe.png wenn du nun im css schreibst img{display:block} dann werden alle bilder zu block-elementen block-elemente stehen immer in einer eigenen zeile überschriften, absätze, listen, uvm. sind block-elemente das läßt sich im css aber auch ändern, mit: p{display:inline} absätze zu inline-elementen macht aber keinen sinn, zumindest fällt mir kein beispiel dafür ein. in europa wird von links nach rechts gelesen, dadurch ist auch das meiste linksbündig (in europa) man kann im css nicht nur einstellen, ob text links- oder rechtsbündig ist, man kann dort auch die leserichtung angeben. der standard ist ltr, also von links nach rechts (left to right). schreibt man nichts ins css, ist text linksbündig und wird von links nach rechts gelesen. das gleich gilt aber auch für (fast?) alle elemente. zumindest für inline-elemente. die rutschen, je nach platzverhältnissen, nach oben und nach links. wenn in einer reihe kein platz mehr ist, wird in der nächsten zeile links weitergemacht. das ist der sogenannte „normale fluß“, so wird er glaube ich oft bezeichnet. elemente, die gefloatet werden, werden aus diesem fluß herausgenommen. es gibt für float nur die werte left und right (und none und inherit, aber das ist hier unwichtig). ein element kann also, wenn es floatet, nur entweder links oder rechts floaten, nicht in der mitte. alle NACHFOLGENDEN (block-)elemente tun so, als wäre das gefloatete element nicht da, sie rutschen drunter. deren inhalte aber umfließen das gefloatete element, gucken also darunter hervor. wenn du willst, daß (irgend-)ein nachfolgendes element merkt, daß da ein vorhergehendes floatet, mußt du es clearen, dadurch rutscht es nicht drunter. ich hab zu dem thema schon eine menge seiten mit erklärungen gesehen, aber mir fallen gerade keine ein. daher schreib ich das hier nicht ins icq, sondern ins board, vielleicht hat gerade jemand was zur hand (was zum lesen …). Daher auch die Kleinschreibung, hab’ aus dem Nachrichtenfenster kopiert. Hier schon mal ein Link: http://www.css4you.de/float.html ps: Zitat:
Das div#header ist eigentlich überflüssig. |
|
|||
also als anfänger in dem sinne kann ich dir nur raten mit dem absoluten grundwissen anzufangen.
nur so wirst du einen kompletten unterschied feststellen. meine erste seite war zu 100% mi tabellen. Alles ging schnell und erzielte seinen effekt nur sah es miserabel aus. die 2. umstellung erfolgte mit bißchen css und jetzt habe ich es bis auf eine linkseite alles mit css gemacht und haut mich ehrlich egsagt vom hocker das ich das zustande gebracht habe. css ist das beste was es gibt so java zeug kann man von mir aus je nach fall dazu nehmen aber ansonsten nicht. Außerdem merke ich wie mir einige Kenntnisse fehlen die auf eben die nicht ganz durchgeackerte Basis zurückzuführen sind. Eine übelst leichte Einsteigerseite ist PLANETHTML danach kannst du zu selfhtml umsteigen. und dann css tutorial bei googel suchen da gibt es einen riesenhaufen an seiten die das thema behandeln. alle sist irgendwie miteinander vermischt. mfg sinot
__________________
Du bist vom Himmel gefallen erstrahlender Sohn der Morgenröte. Zu Boden bist du geschmettert du Bezwinger der Völker. Die Mega-Mod: http://doom3.planet-multiplayer.de/d...d.php?view.567 http://doom3.filefront.com/file/Maximum_Graphic;50595 |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Css Menü al Anfänger | nopox | CSS | 3 | 12.01.2012 01:29 |
Inspiration - Sammlung von Links | emti | Ressourcen | 8 | 01.12.2009 19:02 |
Ich hasse CSS... | neu-art.de | Offtopic | 24 | 30.08.2008 14:11 |
CSS für Anfänger | Sephi | CSS | 1 | 03.12.2006 00:01 |
Mozilla ignoriert externes css | DarkWanderer | CSS | 9 | 22.09.2005 12:39 |