Best way to learn CSS?
- Started
- Last post
- 64 Responses
- Bullitt0
Best way to learn is to force the issue. I learned because my role ( at the time) demanded it. HTML dog is a good start for a book though.
Code in notepad. no dreamweaver.
- Milan0
The most important things to learn with CSS:
- box model
- difference between block and inline elements
- difference between relative and absolute positioningOnce you learn this, everything else is a piece of cake.
- + float/clearing
Mojo - that too!Milan
- thanks I'll make sure i get those nailed before carrying onProjectile
- + float/clearing
- Milan0
What moth said earlier, use a reset. I find this to be enough for most projects:
* {
margin: 0;
padding: 0;
}
- lukus_W0
Best way is to get a CSS brain blaster:
- Daithi0
The way I learned...
Eric Meyer's CSS Sculptor — it won't win any beauty pageants, or UI awards, but it allows you to build pages in CSS. By forcing you to go through series of tabs: Design / Boxes / Type etc it makes you understand how CSS works. It also generates heavily commented code which explains what everything is doing.
http://www.webassist.com/dreamwe…
Then, when you have built the basics CSS Edit is great for editing and tweaking what you have done. It's a much nicer programme and works quite smoothly. It also allows you to analyse websites that you see which is a great way to learn http://macrabbit.com/cssedit/
Then when you can actually do stuff, Coda is the business. www.panic.com/coda/
...not necessarily the best way. It's also handy to have friends to ask when you get stuck, or to just plain do things for you when you're really stuck.
- Eric Meyer likes my work :o)seeessess
- oops, forgot the link http://www.flickr.co…seeessess
- inteliboy0
As long as you already know html - it's really not that difficult no?
Didn't do the book thing. Just followed a basic 2column layout tutorial - and by the end of that it was pretty clear how CSS worked. After that it's just experience and figuring out the best way to do things.
Dorky lists like "Top 10 CSS Tips" actually are super super helpful.
Also -- though easy to master, it's always always going to take time, money and migraines to get shit working in IE. Kill it.
- OSFA0
I know it's been said here before, but I am in a bit of a hurry purchasing some books and decided to get one on CSS in order to learn.
Is there one that you would recommend for a beginner?
Thanks!
- forcetwelve0
i taught myself basic stuff by opening free templates off the web in cssedit and looking through and changing the styles. it's really simple when you get the hang of it (basic stuff anyway).
- this is what i did as well. Then use online stuff for learning further. am still learning though ;)theredmasque
- clearThoughts0
I find it hard to believe that somebody doesn't know HTML or CSS.
I'm sure 99.7% of the worlds population doesn't, but I just been pretty much working with HTML for the past 9 years and it just became such a natural thing to me...- Some people are still making the CSS change. Nothing to knock the guy for.ETM
- *hangs head in shame*Projectile
- clearThoughts0
What's difficult to understand on a <p> tag or <h1> tag....
or something like 'margin-left: 20px' ??- type styling is the easy part, layout is the unpredictable part....vaxorcist
- OSFA0
Got some store credit...Which one should I get?
- forcetwelve0
just use cssedit and coda - teach yourself by opening up a downloaded free template.
- ckentish0
Just Do It
- ETM0
I find the biggest problem when designers want to switch to CSS is that they immediately want to create large complex layouts like they did previously with tables etc.
The best way is just to start really basic and build on it once you get comfortable. Start by getting the most basic, header, left nav and right content layout working. Play around with it.
When you're good with that, start positioning elements (divs, images etc.) with floats. Play with the values and see (understand) the results. You have to start with the basics or you will always be overwhelmed. You don't build a house without learning how to even frame a wall.
Also, while learning, add a unique background color to every div while you are laying things out. It will help you identify what is messing things up when things go wonky. Pretty soon when the foundation is solid, and you can create these basics without referencing anything, you'll have the understanding to start wrapping your head around bigger concepts.
- everything after ETM is subjectively questionable in this post.version3
- version30
dive in head first with your feet planted firmly on the ground and your head in the clouds
- jysta0
1) Firebug in Firefox > CSS > edit (see your effects live)
2) Coda, it's got books for both html and css for reference and you can edit visually instead of typing which starting out helps a lot.
3) Get a CSS cheatsheet here: http://www.addedbytes.com/cheat-…
- monNom0
Make up a project and just get started. If you don't know the first thing about it, start small and adapt someone else's code so you're at least working on something that's not completely eff'd. When you run into a problem, look it up and figure it out.
That's what I did/do anyways.