What are HTML and CSS files, and what do they do?

For those students currently taking any IT101 or CS213 section, one problem I’ve been asked about in web design is the difference between .HTML (or just .HTM) files and .CSS files. Hopefully I can clarify this:

First, as you may know, HTML stands for Hypertext Markup Language. Simply put, HTML is the standard “language” that people use that tells the computer to create a web page. And HTML files are pages written in – what else? HTML – which become a web page when viewed in a browser.

CSS, on the other hand, stands for Cascading Style Sheet. CSS files by themselves can’t be viewed as web pages. Instead, one CSS file is able to change the appearance of any number of HTML files – all at once.

So, if you want every single page on your website (or just certain ones) to have a purple backdrop and cursive, size 14 font, you can make this change across all pages simultaneously, simply by changing this in the .CSS file. This change is then reflected across all HTML web pages that “ask” for the design to be determined by the .CSS file.

This has many applications in web design. If the web designer is looking for a new style and feel (such as warm red and orange tones for fall), he or she can easily make this change for the entire web site without changing these properties for every individual page.

Sources:
http://www.w3.org/Style/Examples/011/firstcss.en.html