Website mit css und html - bin noch anfänger

[Chillkroete]

Hey community,

da ich noch absoluter Anfänger in html und css bin brauch ich mal eure hilfe.
Möchte das Design hier, gerne umsetzen.

Nach einigen Tutorials frage ich mich, wie ich am besten anfange, denn irgendwie hat jeder seine eigene Arbeitsweise.

So sehe ich bei manchen Tuts, dass ein weißer Hintergrund als Bild eingefügt wird, sowie ein ganzer Header mit schrift und nur die Navipunkte mit html und css gemacht werden. Siehe hier http://www.perfekte-website.de/technik/html-homepage.php

Bei anderen wiederrum wird der Hintergrund mit css gemacht und im gegensatz zu dem gezeigten tutorial, für jeden Bereich neue divs erstellt...

Also letztendlich, nach 10xxxx videotuts, stellt sich mir die Frage nach der gängigen/üblichen und saubersten arbeitsweise mit html und css.

Wenn mir jemand vll. anhand meines Screendesigns sagen könnte wie er vorgehen würde und wie die wirkungsvollste Umsetzung im allgemeinen funktioniert, wäre das schonmal einen super sache.

Ich, nach meinem jetztigen wissensstand, würde hauptsächlich in html und css arbeiten und nur diese farbstriche im content und im footer den farbpinsel als img reinladen

Hoffentlich nimmt sich jemand die Zeit mir soweit zu helfen, bis dahin wünsch ich einen schönen abend


p.s.: Unterseiten sind noch keine entstanden und screendesign ist nicht zu 100% fertig.

 

[cebito]

AW: Website mit css und html - bin noch anfänger



rot = Bilder im HTML
blau (oder Lila) = Hintergrundbilder per CSS

Alles andere kommt Ohne Bilder aus und ist mit rein HTML und CSS zu realisieren.

 

[CrazyLopp]

AW: Website mit css und html - bin noch anfänger

Cebito hat dir ja schon gesagt wie man dies am besten mit Grafiken lösen kann, bzw. was eine Grafik sein soll. Im ersten Schritt solltest du auf jeden Fall erst einmal die HTML Seite umsetzen, damit du schon einmal das Grundgerüst hast, dann kannst du mit dem CSS loslegen...

Bei dem CSS kannst du noch ganz auf Bilder verzichten, da du diese ja im Nachhinein machen kann. Dies kann gerade am Anfang helfen, da du so Schritt für Schritt die Seite basteln kannst ohne sofort vor einem großen Haufen von Problemen stehst...


Wie du schon sagt, es gibt viele Wege, und am besten solltest du mit einfachen Dingen anfangen und so dann Schritt fr Schritt zum Erfolg kommst...!

 

[oxion]

AW: Website mit css und html - bin noch anfänger

Für die Hintergrundgrafik vergibst du einfach im HTML eine <div>-Box als Wrapper, dort platzierst du die Grafik via CSS und lässt Sie mit background-position: bottom gen Ende der Box ausrichten.

In die Box kommen dann der Header sowie Content, Footer etc.

 

[Chillkroete]

Vielen dank für eure Antworten ;>
Sitze nun gerade an der Umsetzung und hab ein Problem mit dem Footer.

In html ein div mit "footer" geschrieben und in css mit background-image:url;
versucht anzugeben passiert nichts. Weite und höhe hab ich auch angegeben.

hier mal etwas genauer:

<div id="wrapper">
<div id="header"></div>
<div id="inhalt"></div>
<div id="footer"></div>
</div>

und für den footer in css dann:
#footer
{
background-image:url(image3.jpg);
height:109px;
width:940px;
}

Muss ich noch im div <img src....> angeben ?

Ich seh nämlich leider nichts in dreamweaver, nur wenn ich "live-ansicht" wegmache seh ich die footer grafik.

Ich merke gerade, dass es bei mir einen starken Unterschied zwischen "live-ansicht" und keiner im dreamweaver bei mir gibt.
So werden auch keine Zeilenumbrüche angezeigt, erst wenn ich "L-A" ausmache.

Woran könnte das leigen ?

 

[Myhar]

AW: Website mit css und html - bin noch anfänger

Kurz gesagt: Vergiss die live-ansicht im Dreamweaver und kontrolliere die Seite in einem Browser deiner Wahl. Es surft nämlich keiner mit Dreamweaver durchs Internet, also wird auch keiner die Seite so angezeigt bekommen, wie sie mal im Dreamweaver ausgesehen hat.

L. G.

 

[Chillkroete]

Ok, das stimmt.
Nur hab ich das Problem, dass er mir zwei unterschiedliche Versionen meiner Umsetzung anzeigt, je nach dem ob ich mit safari oder firefox schaue.

<link type="text/css" rel="stylesheet" href="style.css" />
</head>

<body>

<div id="wrapper">
<div id="header"> <h1>el <br>color <br />amarillo</h1></div>
<div id="inhalt"></div>


<div id="footer"></div>
</div>

</body>
</html>

@charset "UTF-8";
/* CSS Document */

html
{
    background-color:#f8dc40;
    text-align:center;
    
    }
    
    #wrapper
    {
        width:942px;
        margin-left:auto;
        margin-right:auto;
    }
    
    #header
    {
        text-align:left;
        width:942px;
        height:125px;
        background-color:#303030;
        margin:auto;
    }
    #header h1
    
    {
        font-family:Arial;
        font-weight:bold;
        font-size:36px;
        line-height: 18pt;
        
        color:#f8dc40;
        margin-left:80px;
        padding-top:24px;
        
    }

    
    #inhalt
    {
    }
    
    #footer
    {
        background-image:url(image3.jpg);
        width:940px;
        height:109;
    }

ok habs gefunden, es fehlte nur ein px ;/

 

[cebito]

AW: Website mit css und html - bin noch anfänger

Hab gehört, hier gehts weiter, dann brauchts den Thread ja nicht mehr... - geschlossen!