RSS
CSS Videos
By Ashton Sanders

CSS Properties

What is Cascading Style Sheets?

StupidMehOkayGreatAwesome!
(238 votes, avg: 3.45/5)
Loading...

Video Transcript:

*This has been recently Updated! Enjoy the new version and let me know what you think.*

Welcome to CSS Videos.com. My name is Ashton Sanders and this is the first CSS video tutorial, so I will be answering a very important question: “What is Cascading Style Sheets?”

But before we get to CSS, we must first quickly define HTML as CSS works with HTML to make websites faster and easier to edit.

What is HTML?

HTML (HyperText Markup Language) is the most basic programming language for websites. HTML consists of elements (or tags) that are used to create websites. For example, the HTML element “<p>” is used to create a paragraph on a web page.

<p>Here’s an example paragraph in HTML code.</p>

Web pages are created with HTML elements and then CSS is used to style those HTML elements and define how they will look.

What Does CSS Do?

CSS allows you to style a lot of different aspects of HTML elements. You can use CSS to do things like:

  • changing the font, size and alignment of text
  • adding a background color or background image
  • adding a border
  • create a drop down menu
  • define the width and height of an element
  • and much, much more…

How Do People Use CSS?

As CSS is so versatile, people use it as much or as little as they want. Any part of a webpage that doesn’t get created with HTML can be done with CSS.

One recommended practice is to use HTML to:

  1. Define the different areas of your web page (ie. header, sidebar, content, footer) and
  2. Fill it with content (text, images, etc.).

Then you use CSS to:

  1. Format the size and placement of your web page areas
  2. Style the content (color, size, bold, font, etc.) and
  3. Add the design (look and feel) to the HTML.

Purpose of CSS?

The purpose of CSS is to keep as much of your actual content (HTML) separated from your design styles (CSS). This allows you to make website-wide changes easily. For example, if you want to change the color of all the text on your website, you only need to change the color in your CSS file, and your entire website has been updated.

Cascading Style Sheets helps to keep your code clean, decreases your file size and gives you mountains of functionality.

I hope you enjoyed the CSS Tutorial. As I’m always looking to improve my videos, please leave a comment below with any suggestions or recommendations you may have to improve them.

Thank you very much for watching this CSS Video on “What is Cascading Style Sheets”.

Ashton Sanders
CSSVideos.com

This entry was posted by Ashton Sanders on Sunday, April 26th, 2009 at 2:46 am and is filed under CSS Basics. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

32 Responses to “What is Cascading Style Sheets?”

  1. Larry says:

    Hey, Ashton. I like the idea for your site. A little typo on the first page. I am not sure what the “that” is at the end of the first sentence.

    • Ashton Sanders says:

      Hi Larry,

      Thanks for pointing out the typo. I have been updating this video + post, moving hosting, etc. I have fixed it up, so everything should be golden now.

      Ashton Sanders

  2. Ian Merwin says:

    Go Ashton! Tweet when you get another one up! THANKS!

    • Nerrad Loco says:

      Pow Mia Esze

      • Mij Loco says:

        Pow Mia Esze Rin To

  3. anny says:

    u videos are very wonderful,it makes me easy to understand how css works,but why not update? i wanna see more.please…

  4. Robert Kennedy says:

    I was checking out your vidz to brush up on my css. Then I started wondering how come this guy isn’t selling a video course on css?

  5. seo teknikleri says:

    Thanks for videos

  6. Raj says:

    all videos are so nice, thanks for video.

  7. Julie Gates says:

    Several months ago, I was hired by a web design firm. I had very little knowledge relative to computers, etc. My employer was willing to take a chance on me and teach me everything she knows. There are days however, when she is too busy with her clients to work with me. By the first tutorial, it becomes readily apparent that I will be able to learn even when my employer is busy.
    Thank you so much!
    Julie

  8. Larry says:

    A CSS site using Flash video??

    c’mon, how about html5 and css3? Lol

    • Ashton Sanders says:

      Haha. You know HTML5/CSS3 is just another way to play Flash Video? I’m using the Javascript swfObject because it works on more browsers than HTML5/CSS3 does. As it becomes more widely used, we’ll definitely upgrade.

  9. CSS Video Tutorials says:

    […] What is Cascading Style Sheets? […]

  10. mimshach lirfa says:

    hey ashton, am mimshach from Nigeria and i got to know about your site searching google, i wanna learn more about css, am an amateaur web designer, i just started learning macromedia dreamweaver 8, and what i can do are really very limited, pls can u guide me through using css to design a webpage.

    • Ashton Sanders says:

      Hi Mimshach. Yes, that is the plan with all of these videos. There is a good deal to learn, and lot of videos to make, so I’m working on it. =0

  11. Karim says:

    Hi Ashton,

    I stumbled upon your website through Google search. I was looking for a basic tutorial on CSS. I must commend your effort for putting up the free video tutorial. The way you explain the basic concept of CSS in the first video is very good and clear. It would be nice if the video can be made larger. I would also suggest if you can produce a video how to set up the whole webpage (with all the typical elements) from ground up using html/CSS. Once again I appreciate your effort and let me thank you for your contribution to the knowledge society.

  12. 25+ Best CSS Video Tutorials | Submit Links says:

    […] View Tutorial […]

  13. Kevin says:

    Hi Ashton,
    This is my first time visiting your website. Awasome. Kindly keep up the good work. Hope you will also deal with css3 & html5. Greetings from Germany.
    Kevin.

  14. 25+ Best CSS Video Tutorials | 1 step web design says:

    […] View Tutorial […]

  15. Manu says:

    Hey AshtonSanders,

    Great effort made.Easy way to start CSS through..
    It would be still appreciated if the upcoming videos are still updated.
    Since I’ve seen it now,I dono whether we have a updated series..If you do,dont mind me in sending the link.

    Once again gud job..

    MANU,
    India

  16. Will says:

    Thank you for making this video – very helpful. I often wondered what CSS was! Now I will watch the next videos and hopefully start using.

  17. Philipp says:

    Hi Ashton,

    just wanted to let you know that you are too close to the mic which is causing some distortion.
    What type of of mic do you use? Do you use a pop filter?

    Your didactic approach is not perfect but videos are better than most of the other tutorials on the web. 🙂

    otherwise nice job, well done.

    Philipp

  18. Rober says:

    I am new to CSS and I’m very grateful for your service here. I hope you continue from a premise teaching from scratch as this is the only way to get started.

    Thanks
    Robert C

  19. Jay says:

    Hey Guys !

    Thank you very much for your videos , top mate !! helped me a lot . but I am still bit confused about CSS. I just took up a course in web designing , and it’s all new to me , but I am a person who doesn’t take a yes or no as an answer , meaning I like to dig deep to find answers to a simple question .

    I don’t want to learn that CSS only helps to style a website , font , layout ….ect .

    can someone please tell me what do I need to learn about CSS please.

    Jay

  20. Behzad says:

    Thanks it was great, please keep continue of it in professional parts.
    All The Best

  21. kenzy says:

    nice one

  22. annie says:

    Thank you for taking the time to make these videos. I paid for a CSS class and was very frustrated because the teacher is not doing a very good job of explaining the material by breaking it down into digestible portions. I had given up trying to learn the concept. In 2 minutes you managed to do what they did not in 3 hours.

    • Ashton Sanders says:

      Thank you very much. I’m glad I could help. Let me know if you still have any questions that aren’t answered in these videos.

  23. David says:

    Thankyou very much for making this videos. I’ve just seen the first one and I think this tutorial will be great. I really feel like to watch all them.

    Is fantastic having people like you! Congratulations!

  24. Gina says:

    Ashton,
    It would be nice if you add closed captioning on all of the videos because I am Deaf. Can you do that for your Deaf audience? Thank you, Gina

    • Ashton Sanders says:

      Hi Gina,

      I may be able to do that in the future. For now, I have transcribed the entire video into text below the video. I hope that helps.

      Ashton

Leave a Reply to Larry

 
 
.love { css: awesome }