[AnOnYmUs]

Tjena.

Jag har aldrig riktigt användt css till mina sidor men tänkte att det är dags nu istället för att köpa in den tjänsten hela tiden. Har tyvärr 2 fötter i en table och har fastnat där rätt länge, men vill liksom dra mig ur det sättet att forma en hemsida.

Har kollat lite på olika webbsidor där dom förklarar hur man använder CSS men det är ganska rörigt ändå. Hur lärde ni er CSS? Var det genom en mjukvara (Topstyle, Rapid, Dreamweaver) eller var det genom traditionella Notepad?

Har ni något tips på någon sajt som förklarar steg för steg, gärna med olika exempel och bilder på exemplen.

Vilken mjukvara skulle ni rekommendera?

Tacksam för svar!

// AnOn

[Cosma]

Jag använder notepad++ för min kodning. Om du frågar mig så är det långt ifrån rörigt när du väl kommer in i det.

För att lära dig kan jag inte komma på mer än att kolla på grunderna och göra några tutorials. Dem här länkarna kanske hjälper dig lite på vägen..

70 Expert Ideas For Better CSS Coding
http://www.smashingmagazine.com/2007/05/10...ter-css-coding/

CSS Editors Reviewed
http://www.smashingmagazine.com/2008/06/19...itors-reviewed/

EDIT: stavning :P

[andi]

Med denna sida kommer du långt:

http://w3schools.com/css/default.asp

[Karman]

För OS/X rekommenderas Textmate eller Coda.

[dlg]

textmate!

[Craxen]

Kolla på efterföljaren till frontpage (microsoft expression web)

Tror du kan hitta lite tips o trix där kanske

[KarlRoos]

Har du Mac så ska du köra Coda, klockrent program. Annars skulle jag nog välja Dreamweaver.

Ska du lära dig CSS så följ lite olika bloggar med inriktning på CSS, läs lite varje dag och du kommer såklart att lära dig. Pröva även att använda dig av CSS, gör en mockup för en layout och bestäm dig för att göra den med block och CSS.

Du kommer att stöta på många problem, men det finns minst lika många fixar och du kommer lära dig att Google är din vän. Det finns alltid någon annan som har stött på samma problem tidigare och du kan faktiskt göra allting med CSS, men det är "hur" som ibland kan vara problemet.

Lycka till!

[AnOnYmUs]

Tack för alla svar.

KarlRoos: ja det är väl just det som är problemet, att man ständigt stöter på problem. Jag tror jag behöver grunden i "hur" man bygger med CSS, finns det några generella regler? Jag har redan design och sådan klart, men att sedan bygga det efter en CSS-mall visade sig vara riktigt svårt.

Måste ju vara rätt eftertraktat efter "videos" eller "tutorials" där man bygger en komplett sida och sedan visar varför man måste lägga in dom ena och dom andra blocken osv, och vad som styr vad.

[terbon]

Följ detta flödesschema.
1. Gör endast html / markup. Använd semantiska element och gör det helt utan tanke på design, utan endast med tanke på vad som är logiskt. Ha en <div> samt ett id per modul, samt omslutare för de olika delarna, exempelvis: <div id="wrapper"><div id="header"></div><div id="content"></div><div id="footer"></div>.
Döp dina "boxar" med logiska och designbefriade namn. Exempel på dåligt namn: #right-to-header. Bättre namn: #information.
Sen med att göra html:en "designbefriad" innebär också en förändring av hur du använder bilder. Alla bilder som är designrelaterade (exempelvis logotypen) kommer du fixa med css. Så gör bara en <h1>Sidnamn</h1>, alltså det du ska använda <img> på är typ, banners, annonser, ja. Sånt som du inte egentligen skulle ändra på ifall du skulle byta design.

2. Nu gör du css, då kommer du ha en utmaning de första gångerna. Du ska nämligen (i den mån du lyckas med) göra hela designen med css. Det kan vara lite jobbigt i början. Och vissa saker kan du vara tvungen att lägga till några små klasser i html-koden i efterhand. Men ju färre sånt du behöver använda, desto bättre. Du kan kolla lite på pseudo-element som typ :after :last-child. Så kan du lösa många problem. Du kan ju dra in nån dean edwards IE js om du vill att IE ska ha stöd med det (cross-browser stöd blir lite jobbigt när man precis börjat med css).

Förövrigt är det FÖRBJUDET att använda designrelaterade taggar såsom <font> etc.

Här finns två "starta-guider" som kanske kan hjälpa, inte så nygjorda men grunden lär du dig bra där.
http://exscale.se/archives/2006/03/2...-website-pt-1/
http://exscale.se/archives/2006/04/0...-website-pt-2/


Hoppas detta hjälpte någonting, mvh

[Magnus_A]

Firebug i Firefox, du ser i realtid hur det ser ut när du ändrar koden. Sen måste du skriva in ändringarna i din sida.