CSS: The Very First Steps – New Premium Tutorial

This one is for those who are hoping to take their first steps into web design. This 70 minute Premium video tutorial will assume that you have zero knowledge of CSS. Over the course of the screencast, you’ll learn about the basic syntax, a plethora of different properties, and how to create the beginnings of your very first website.

Don’t know what CSS stands for? Need help diving into CSS? Never created a website before? If so, this screencast was tailor-made for you! Sign up for a Premium membership!

Join Tuts Premium

NETTUTS+ Screencasts and Bonus Tutorials

For those unfamiliar, the family of TUTS sites runs a premium membership service called “Premium”. For $9 per month, you gain access to exclusive premium tutorials, screencasts, and freebies at Nettuts+, Psdtuts+, Audiotuts+, and Vectortuts+! For the price of a pizza, you’ll learn from some of the best minds in the business. Join today!

  • Subscribe to the Nettuts+ RSS Feed for more daily web development tuts and articles.


Related Posts

Add Comment

Discussion 34 Comments

  1. kevin says:

    so tempting now

  2. patvillaruz says:

    cool! ^_^ i cant wait to read it! ^_^

  3. Very nice tutorial. Thanks.

  4. EGY99 says:

    Finally, a Tuts for 100% beginners :-)
    I’m glad I’m a Tuts+ member!!!

    Thanks JW
    Keep them coming.

    • wnabcreative says:

      I want to start learning. As you are a beginner, I think you can help me how to start.
      Because of health problem I almost locked up in my house for a long time, so that don’t know anyone who can help me about this. Pls help me.

  5. EGY99 says:

    @Jeffrey Way
    I have a recommendation. The free Tuts and Tuts+ content can be organized or filtered as for “Beginners”, “Some experience” and “Advanced”? That way we can get the right content faster

    • Belinda says:

      I think that would be a fabulous idea :-)

    • Laneth says:

      I reckon this would be an excellent idea as well – that way you wouldn’t get all those people in the comments complaining about the beginner tuts, even though they’re clearly marked as “For Beginners”

      Bravo Jeffrey! I have your PSD to HTML/CSS to Wordpress Plus Tutorial constantly playing in the background while I work so that I can learn the ins and outs of a basic site.
      Between that tut-set and the jQuery series on ThemeForest, you’ve taught me so much – I’m so grateful!

  6. Didn’t see it in the Latest plus box on the dashboard, I agree their needs to be a better system for downloading Plus content. Also when I login to the dashboard I don’t want to be redirected to the Account page, I just want to download some plus content!

  7. David Ferguson says:

    @Jeffrey Way
    Just something I thought should be mentioned should you decide to take this tutorial (beginner css) any further, but be sure to mention how adding padding and such affects the width of objects and such. That may be kinda confusing to someone new if they are trying to place items in a container with a specified size and it doesn’t seem to wanna line up right.

    Also, I don’t know if this is something you could easily go back and fix now, or if you would want to bother, but, at around 59:30 into the video, there is overlapping audio. Sounds as if audio from another video got overlaid onto this one :(

    • Jeffrey Way says:

      Hey David. Can’t believe you bothered to watch. :) This was for beginners.

      I’m utterly baffled about the 10 second audio problem there. Actually – I don’t think I did any editing of this video. Very strange. I’ll try to fix it soon. :)

  8. Towel says:

    I already knew enough CSS to get by but this tut really helped.

  9. Jenart says:

    That was an awesome tutorial, it taught me so much more than i already knew.
    Thanks =D

  10. Chris says:

    I find it funny that they offer “source files” when you can easily snag css files from any website ^^. I guess if it makes things easier then it’s useful…

  11. Jeff Adams says:

    Part of me is selfish and wants to see more jQuery or PHP tutorials, but part of me felt a little proud that such an awesome tutorial came out of a site that I’m a member of.

    I’m not the intended audience, but even I picked up alot of best practice and that might sound crazy but it’s true! Plus as well, teaching others seems quite natural to Jeff so keep it coming!

  12. Andrew says:

    Why is this a plus tutorial? I’m guessing that most of the readers of Nettuts are way beyond an introduction to CSS. So for those who already have a plus account, I’d bet this isn’t going to do a ton for them.

    I guess I see a tutorial like this as a way to show people what a plus tutorial is like and if it is worth it. But I think it is weird that you are making a plus tutorial for beginners, beginners probably being the demographic that would be on the fence about spending money on a subscription. While the more advanced users, who already have a plus account for all the other great tutorials on this site, probably already know most of the information in a tutorial like this.

    Don’t get me wrong I think this site is great, just think this is a little out of place.

    • leonardo says:

      i hear you on this one. i am beginner and wasnt a member but payed to see this tut…

    • Cumbrian says:

      I couldn’t disagree more, Andrew.

      Surely there are subscribers of the site who excel in certain areas like graphics for whom a beginners guide to CSS is a great way for them to spread their wings?

      If we all know it all already then the site is somewhat redundant.

      Good to have you on board Leonardo!

  13. Raoul says:

    You make me understand YEAAARRRSSS of ununderstanding (if this word exist…)

    Thank you !!!!! ^^
    R.

  14. Richard Bagshaw says:

    Great tutorial — this and the CI ones are really good, very clear and professional.

  15. Francisco says:

    Very nice tutorial. Thanks.

  16. Joshua says:

    I have waited for almost a year for this! Thank you so much! You Rock!

  17. Peter Breis says:

    Thanks for a fascinating and informative tutorial on CSS. It has clarified so much for me.

    Just one thing, since I would like to practice everything I learnt, could we have this as a non-streaming flash movie? Or even as a printable tutorial.

    It is a very big stream and I can’t DL it to my desktop.

  18. leonardo says:

    Great tutorial for those who are jsut starting and trying to understand about webdesign basics like me.

    I am glad i joined as a member :) it would be great if you could continue this tutorial and do the second part, creating pages and adding a cool effect navigation bar.

  19. Lawrence of Haiti says:

    New to CSS, but loved this video… the way you taught just makes sense and I picked it up pretty easily. Looking forward to more advanced editions. Great job!

  20. Athear Najor says:

    Jeffery,

    I’m sort of a newbie to css and think this would help me but… unfortunately about 15 min into the tutorial flowplayer stops and gives me the loading icon and never ever loads again. Is there a problem in the streaming of the vid?

    I pay for a monthly subscription and really would like to view the whole tutorial. Is it possible to download this tut directly to my desktop.

    Also when directed to this content I sometimes get two options on the right

    1. Download Video
    2. View Screencast

    Both are not always available. Just thought I’d let you know.

    Thanks,

    Athear

  21. Kevin Rivers says:

    The screencast nor the download are working properly. The screencast stops loading around 12 minutes and the downloads will not complete in Safari or Firefox.

  22. suneohair says:

    The video doesn’t seem to be working.

  23. Milan says:

    Is there anyone who can pay Plus account for me, because there is no PayPal in my country, and I just love these tutorials?
    I would pay whatever it costs, if there is someone who could help me. I have a Moneybookers account, so I will pay to whoever who can create a Plus account for me after my payment to him.

    Thank you

Add a Comment