Erstes css layout - bitte einschätzen

Dieses Thema im Forum "Webdesign" wurde erstellt von nosam, 13. März 2008 .

Schlagworte:
  1. 13. März 2008
    Hi!
    ich bin seit heute Krankgeschrieben und habe mich mal dran gemacht endlich mal layouten mit css zu lernen

    nach ca 8 stunden lesen und rumprobieren ist dann das hier rausgekommen:
    http://thunderofwar.th.ohost.de/mason/home.htm

    würde von euch gerne mal ein feedback haben ob ich schon gut gelernt hab =D
    (ich möchte keine aüßerungen über die einzelnen grafiken... die hab ich eh nur schnell hingeklickt =D)

    hab ich das grundprinzip verstanden?
    gibts an der form was zu bemängeln?
    hab ich mir einige sachen zu umständlich gemacht?

    bitte postet dann auch die entsprechen codestellen und die verbesserungen (vllt auch mit zeilenangabe ^.^)

    für die suchfaulen unter euch hier noch der direktlink zur css datei:
    http://thunderofwar.th.ohost.de/mason/piczo.css

    und wie gesagt war mein allererstes css layout also seid bitte nicht zu hart in der kritick *liepgugg*

    bw für objektive und hilfereiche tips is ehrensache =D


    greetz nosam
     
  2. 13. März 2008
    AW: Erstes css layout - bitte einschätzen

    sers!

    abgesehn von den verwendenten grafiken is es doch vom code her weitesgehend ok.

    du musst nicht margin:none; angeben. du kannst das weg lassen!
    font-family:"Arial Black", Arial; <-- wieso is das Arial Black in "" zeichen?

    das bei #text:
    Code:
    border-style:solid;
    border-top-style:none;
    border-color:#FFFFFF;
    border-width:3px;
    
    kannst du auch so machen:
    border: solid 3px #FFF;
    border-top: 0px;

    is weniger und besser

    Code:
    top:0px;
    left:0px;
    
    kannst du auch weglassen. weil er, wenn nichts angegeben ist, von 0 ausgeht.
    und allgemein, wenn du z.b. die farbe weiß hast, musst du nicht #FFFFFF machen, sondern da reicht auch #FFF. Also wenn quasi alle 6 zeichen gleich sind bei: #334455 sollte #345 auch gehn.

    hab grad 3 maß (maß = 1l bier) intus, aalso falls iwas sinnlos is, ignorieren

    gruß
    gl
     
  3. 13. März 2008
    AW: Erstes css layout - bitte einschätzen

    du hast bei <link rel="stylesheet" ... das / am ende vergessen,
    ansonsten ned so der brüller.

    bei css-layouts ist es eigentlich gang und gebe sachen wie <h1>, <h2> [...] zu verwenden, weil du sie ja mit css optimal anpassen kannst.

    wenn du so weitermachst bist bald bei ner div-suppe gewürzt mit a weng span
     
  4. 13. März 2008
    AW: Erstes css layout - bitte einschätzen

    ach ja das war ja die sache mit den kürzer schrieben ^.^ wusste da war noch was aber danke nochmal für den hinweis ^^

    "arial black" macht programm automatisch ^.^ ka wieso aber geht auch so

    und wie viel nen maß is weiß ja wohl jeder =P

    danke dir trotzdem

    soll mir was sagen?

    ja mit h1 h2 xD stimmt eigendlich ...
    werde ich mal morgen noch ändern ^^
     
  5. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    dass soll heißen, dass du keine ahnung mehr hast, welche class oder id zu was gehört!
    mit h1 etc... is es logisch und das weißt du immer.

    maß is feminin!!
    welches prgramm benutzt du?
    Hoffentl. kein dreamweaver oder adobe golive?
    Wobei golive zum css schreiben, total angenehm is!
     
  6. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    DreamWeaver ist fürs CSS/HTML/PHP schreiben doch auch angenehm? Syntax-Highlighting usw... (wenn man nicht gerade die "Zusammenklick-Methode" verwendet, sondern den Code schön selber schreibt) ?
     
  7. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    1. Also zum einen schließe ich mich dem validator.w3.org an, was seine Kritik an deine Codes angeht.
    2. Entscheide dich bitte ob du HTML oder xHTML schreibst.
    3. CSS - Shorthands un semantisches HTML sind natürlich um einiges schöner.

    Also da kannst du noch einiges machen, zumal ein WYSIWYG - Editor zu nutzen, nix mit "CSS lernen" zu tun hat .... imho ... und nein Dreamweaver ist alles andere als angenehm, weil der WYSIWYG nur zusammenbaut und selbst beim Arbeiten am Code, schafft es Dreamweaver bei unerfahrenen Nutzern, die Codierung etc. zu verhauen.
     
  8. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    also dann doch lieber editor nutzen?^^

    kleine dummbatz zwischenfrage:
    wenn ich h1 und h2 etc einführen will:
    leiber als sub class von den id oder nur h1 ... definieren?
     
  9. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    wenn du nochmal zwischen den h1's und h2's unterscheiden willst, dann mit id's und class's...

    Wann mit id, wann mit class:
    Wenn etwas mehrmals vorkommt, dann class, z.b. class="content"!
    Bei einmaliger verwendung reicht die id, z.b. id="newcontent".

    Wenn z.b. die gleiche ID 2x vorkommt ist es nicht mehr valide, desswegen stattdessen classes!
     
  10. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    du kannst h1 und h2 [..] auch direkt ansprechen mit

    Code:
    h1 { color: red; }
    h2 { color: green; }
     
  11. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    Ja klar, aber ich meinte jetzt, falls er noch verschiedene h1's z.B. unterscheiden möchte!
     
  12. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    eben keinen benutzen^^
    benutz einen der dir syntax highlighting unterstüzt, mehr aber auch nicht!
    z.b. ultraedit!!

    gruß
    gl
     
  13. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    ok ma mit ultraedit probieren weil syntax highlight is mir schon recht wichtig^^


    so hab jetzt nochmal alles etwas überarbeitet und hoffe das jetzt nicht mehr ganz so viele fehler drinn sind
    wie gesagt bin froh wennich was lerne...

    links sind die selben geblieben:
    http://thunderofwar.th.ohost.de/mason/home.htm
    http://thunderofwar.th.ohost.de/mason/piczo.css

    um gleich mal was vorzubeugen
    die klasse .box hab ich eingeführt wegen der randgestaltung (also der abstand den der text von dem rand da hält...) mit padding hat sich dass rechts dann immer breitgezogen oder gibts da ne einfachere möglichkeit auf die ich nur nich gekommen bin ?


    €dit:
    ein problem hab ich allerdings noch :
    der macht nach der überschrift nen zeilenumbruch der nich sein soll xD wie bekommich das weg?
     
  14. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    h1, h2, h3, h4, h5 und h6 sind überschriften.

    ließ mal bei selfhtml den unterschied von inline-elementen und block-elementen.

    kurz: block-elemente (u.a. auch h1, h2 ...) können nur in <body> der anderen block-elementen vorkommen.

    span ist ein inline-element, h1 oder h2 darf deshalb nicht darin vorkommen.

    block-elemente zeichnen sich dadurch aus dass sie eine ganze zeile einnehmen. inline-elemente nehmen nur den start- und end-bereich ein.

    bsp:
    HTML:
    <div>block elemente</div>dieser text befindet sich UNTER dem div-element
    <span>inline-element</span>dieser text befindet sich NEBEN dem inline-element
    falsch wäre z.b.:
    HTML:
    <span>inline-element <div>block-element in inline-element!</div></span>
     
  15. 14. März 2008
    AW: Erstes css layout - bitte einschätzen

    ja gut jeze hab ich des wenigstens ma gerafft xD (bzw. ich hoffe es xD)
    ..
    manchmal frag ich mich echt wo mein hinr is xD

    nochmals geändert und hoffe dass diesma nix zu meckern gibt ;D
    http://thunderofwar.th.ohost.de/mason/home.htm
    http://thunderofwar.th.ohost.de/mason/piczo.css
     
  16. 15. März 2008
    AW: Erstes css layout - bitte einschätzen

    naja...
    mit h1 etc... beschreibst du eben eher die überschriften!
    also nich so wirklich was mit margin und so und vor allem nichts mit width und height!!!!

    dein navi a und navi a hover, kannst du zusammenfassen in navi und dann die teile, die NUR fürs navi a gelten, sollten in navi a gehn und nur die die fürs navi a:hover gelten ins navi a hover!!

    die sachen zu h1 würd ich mir nochmal genauer anschaun

    gruß
    gl
     
  17. 15. März 2008
    AW: Erstes css layout - bitte einschätzen

    sonochma kleine minimale änderungn...

    aber viel mehr kannich die navi a hover konnte ich gar nicht weiter aufteilen...

    außerdem ist die höhenangabe bei h1 nru drin, weil sonst nich die ganze hintegrund-grafik gezeigt wird...

    die annderen paddings/margins in den h's / in p hab ich nur um die einzelnen einschübe schon vorzudefinieren und ich kann mir nich erklären was daran so verwerflich is ^.^
     
  18. 17. März 2008
    AW: Erstes css layout - bitte einschätzen

    Hallo, bin auch noch net so erfahren mit css,
    hab grad ne frage bezüglich der definition von <h1> <h2> ...

    kann ich die irgendwie verwenden ohne das ich später in der Ausgabe vom Browser die zeilenumbrüche habe??
    das nervt mich immer. zb wenn ich mit <h1> ne überschrift festlegen will die aber direkt über am textinhalt etc stehen soll ohne leerzeile dazwischen?
    vielen dank schonmal im vorraus
     
  19. 17. März 2008
    AW: Erstes css layout - bitte einschätzen

    Es tut mir leid, aber es wäre schon angebracht den Thread auch richtig zu lesen, etwas weiter oben ... Und wenn ich als Leser über solche Textfehler wie deine stolper, ist meine Motivation noch geringer ...

     
  20. 17. März 2008
    AW: Erstes css layout - bitte einschätzen

    ich habe den ganzen threat gelesen !!! meine frage ist ja, ob ich mit irgend einem zusatz die leerzeile von dem block-element unterdrücken kann, oder festlegen kann das einfach das folgende element eine zeile höher anfängt ...was weis ich, mit margin - irgendwas ...

    geht so etwas oder ist das nicht möglich und ich muss es anderst festlegen, zb so wie oben erklärt !! das ist die frage...war evtl bisl undeutlich ausgedrück vorher, sorry
     
  21. 17. März 2008
    AW: Erstes css layout - bitte einschätzen

    is eigendlich relativ simpel ^^

    beim nach der überschrit folgenden element margin-top:-14px; (oder was auch immer deine schriftgröße is ... probier am besten ein bisschen rum ...

    weiß jetzt nicht ob die lösung sehr galant is aber funktioniert ^^

    vllt gibts ja auch noch was besseres?
    *frage einfach so ganz frech in den raum werf*

    btw hättest du meine css datei mal gelesen wär dir des sicher auch inne augen gesprungen (schau dir mal #content .box an) aber naja wayne ... probiers einfach mal wird schon klapen ^^
     
  22. 17. März 2008
    AW: Erstes css layout - bitte einschätzen

    Code:
    h1 { margin: 0; }
    h1, h2, h4 und h4 haben ein margin-top und ein margin-bottom
    h5 nur noch ganz gering und h6 garnicht mehr.
     
  23. 17. März 2008
    AW: Erstes css layout - bitte einschätzen

    Alles klar, dankeschön ! habt auch alle Bewertung
     
  24. 28. März 2008
    AW: Erstes css layout - bitte einschätzen

    ich find den hintergrund nich so gut ^^ und der aufbau da könne ma ein richtigen header machen wo die überschrift steht sonst nice
     
  25. 30. März 2008
    AW: Erstes css layout - bitte einschätzen

    ok ^^ hab ja auch gesagt absehen von den grafiken =D
    bin nich so der gfxer
     
  26. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.