Top 5 Sites To Learn CSS Online

Daniel Pataki 16-03-2009

Web design might not be the most accessible area to everyone, but CSS and HTML can be very useful, and these are two parts of coding which are really easy. I mean to change the color of your font you just need to type: “color:red”, does it get easier than that?


Well actually, it gets harder but it’s worth taking a look, since you can customize everything from your blog to your Google Docs documents with a tiny bit of CSS knowledge.  Let’s take a look at where you learn css online free and get CSS tutorials for beginners.


learn css online free W3Schools is a great site. They have lots of tutorials from HTML to PHP and you can be sure that everything you read is up to standards since the site is maintained by the W3C, responsible for the web standards of today.

The CSS lessons are pretty detailed and will take you through most of what you need to know, but since this is more of a technical page you will see less examples than elsewhere and the examples they do have are a bit constrained.

If you already know some CSS though this is a great reference source.


I come across this website a lot when looking up things and I had a look at their CSS tutorials, which I found slightly better structured than W3School’s. The basic information is the same, but if you are an absolute beginner you might want to start here.


Tizag in my eyes is a bit less formal. It seems to me that their examples are closer to real life and the tone is friendlier. There are also helpful tutorials on many other languages like HTML and MySQL, so if you liked the CSS bit you can stay on for the same quality in other languages.

CSS Zen Garden

This site is very different from the tutorial sites I mentioned before. On CSS Zen Garden you can put your knowledge to the test or learn from the code written by others. The whole idea is that there is one static and unchangeable HTML file and you have to create a separate look for it using only CSS.

You can upload your work and it will be showcased, and you can download others’ files to take a look at how they did this and that. This is really useful because I myself learned way more by example than by actually learning. The same goes for WordPress templates – if you like one, download it and take a peek in style.css to see how things are done.

CSS Play [No Longer Available]

Top 5 Sites To Learn CSS Online cssplayCSS Play is a website in between Zen Garden and the tutorial sites because it shows off specific functionalities in CSS and allows you to view the source code.


Instead of having a whole page or a whole site, you can take a look at examples of flyout menus, opacity examples, IE specific workarounds and so on.

If you need a specific functionality and want to get in the know, this website might be the best place to start. It has a fair share of ads which can be a bit distracting, but the info there is solid, and a lot of times the code, or at least the method is very thoroughly explained.


That’s right, plain old Google Search can be a great companion to learning CSS online and finding CSS tutorials for beginners. Aside from obviously being able to research things you need, you can also look at how specific CSS properties work. Don’t know what values “overflow” can have? Just type “css overflow” or “css overflow property” and the first result will tell you what you need to know.

The same goes for actually all programming languages, I use this for PHP and MySQL as well, and I don’t think the first result has ever failed me yet.


So there you are, no more excuses, it’s time to learn some CSS! You can add your own Google Docs templates, modify your WordPress templates, and do such a lot more, happy CSS-ing!

Related topics: Education Technology, Programming, Web Design, Web Development.

Affiliate Disclosure: By buying the products we recommend, you help keep the site alive. Read more.

Whatsapp Pinterest

Leave a Reply

Your email address will not be published. Required fields are marked *

  1. Frank
    March 24, 2017 at 8:54 am

    I’ve been ripped off , thankfully my friend gave me a reliable contact, he works with discretion and delivers, he does all sorts of hacks, I would prefer to let his services speak for itself, you can contact him Hackingsolution at

  2. DP
    April 21, 2016 at 7:35 am

    I am afaid that W3Schools is not maintained by W3C.

  3. GeekApp - Creative App Landing Page & Blog Theme
    December 22, 2014 at 12:56 pm

    GeekApp is a Creative App Landing page based on bootstrap framework. Perfect mobile app showcase for iPhone, Android and other mobile devices. By zozo shortcode generators you can customize easily to suit your wishes as all files are well commented, also it was 100% mobile responsive design to perfect look on any devices.

  4. CSS Gallery
    January 14, 2010 at 6:54 pm

    Well written tutorial resource!

  5. Simran
    December 16, 2009 at 5:27 am

    You can also read this article

    to learn HTML and CSS online

  6. webexpert
    November 8, 2009 at 4:52 am

    It,s really interesting article.I really eager to learn web designing and development.I was searching about stuff related to CSS.

  7. mwafi
    June 5, 2009 at 3:07 am

    i like

  8. Ashton Sanders
    May 31, 2009 at 12:18 am

    Yea, I've used all of those sites a lot. Great resources. I hope to make it onto that list some day ;)

  9. funny messages
    May 29, 2009 at 6:28 pm

    need to change some css error from this blog:

  10. Luke
    May 27, 2009 at 11:57 am

    Thank you so much for posting this. This gives me some ideas on how to create my own CSS-website.

  11. Sean Tobin
    April 6, 2009 at 1:51 pm is an excellent source as well. It does cost money though. But in my opinion it is well worth it.

  12. ecom
    April 3, 2009 at 12:10 pm

    To get the most of tools, very nice idea. I am eager to see more stuff here.

  13. krishna
    April 2, 2009 at 2:41 am

    Instead of Google Search you might have listed another CSS site here. Google search means again we need to select a site by filtering all the 10 sites which comeup on the result page.

    • James
      January 2, 2010 at 1:32 am

      krishna I agree with you. This could have been a better websites if mentioned here instead of Google!

  14. Mackenzie
    March 20, 2009 at 10:46 am

    CSS ain't programming. CSS & HTML are just markup. Programs actually *do* things.

    • Ashton Sanders
      May 31, 2009 at 12:16 am

      You say that like you've never heard of a CSS Drop Down Menu. ;)

      • Mackenzie
        June 13, 2009 at 1:50 pm

        haha Well.... I suppose :hover kinda involes a finite state machine...

  15. Steve SEO UK
    March 20, 2009 at 3:46 am

    Thanks, I need all the help I can get.
    Have RT'd your tweet.

  16. Art Webb
    March 18, 2009 at 10:14 am

    If you are searching for a tutorial, instead of using Google - try . It is a search engine that only searches tutorial sites.

    • Patrick
      April 17, 2009 at 1:50 am

      Thanks for this great tutorial website. It's a great find.

  17. Jash Sayani
    March 17, 2009 at 6:43 am

    Thanks. Just what I needed.

  18. Tad
    March 17, 2009 at 4:07 am has always been one of my favorite. It includes a selection of tags, the ability to click on a tag/element and get a description, a list of CSS attributes, and of course an area to test code and see the result. Good for when you have some HTML+CSS knowledge and want to see just what that tag/element is going to do and if there are better-suited attributes.