Intro to CSS

Website Presentation

What is CSS?

CSS is an acronym that stands for Cascading Style Sheet. CSS is one of three (HTML, CSS, JavaScript) languages responsible for the basic appearance of a website. Without CSS, a website would look extremely bare—in fact, websites void of CSS would look similar to a standard Word document. Think of CSS as the makeup (lipstick, cologne, etc.) that makes websites “pretty”.

Why External CSS?

In the early pre-CSS days of websites, developers would include an “inline style sheet” within the HTML code. So, to change the following font color to blue, the code used to look like this:

<h1><font color="blue">A Great Big Heading.</font></h1>

view raw gistfile1.txt hosted with ❤ by GitHub

As web development practices progressed, it soon became apparent that mixing content and style needed to stop—and thus was born the idea of the external stylesheet. External CSS stylesheets are now standard because it separates a website’s appearance from it’s content. Remember HTML? HTML is in charge of the website content. CSS is in charge of the website appearance. JavaScript is in charge of the website behavior.

To further understand the vital role that CSS plays, check out an example of what a website would look like without CSS here.

Do I Have to Learn CSS?

Yes, you have to learn CSS. Everything is going to be okay though. It might sound daunting at first, but if you open your mind to learning a new skill, I’m hopeful that you will soon be able to begin writing CSS. And—it’s actually really exciting! Get started learning CSS in 10 steps by checking out the next post, Lesson 1: CSS Basics.

---

Additional Resources

I highly recommend taking this free HTML & CSS tutorial offered by Codecademy. Also, once you’ve got the hang of CSS, peruse this CSS Guide by the Mozilla Developer Network. Lastly, become knowledgeable of the W3 CSS Standards by reading this CSS tutorial from W3schools.com.