HTML and CSS Reference
AS YOU MAKE your way through CSS3 Foundations , you learn CSS from the basics to the more advanced topics,
all the while adding to an overall project that will eventually become a fully featured web page.
Often, I find the best way to learn new things is to create a scenario with particular restrictions and an end goal. In do-
ing this, you can focus on reaching that end goal by limiting the number of choices you have to make (an infinite num-
ber of choices is often scary and off-putting, so it's always good to define boundaries!). This approach to learning also
means you have to make some real-world decisions to get the best possible outcome for the project.
So, without further ado, I'd like to introduce you to the fictitious company Cool Shoes & Socks (CSS for short—get
The folks at Cool Shoes & Socks have asked you to style the company's website for them. This web-savvy company,
like the name says, sells cool shoes and socks. The staff have given you the go-ahead to use CSS3 on the website;
their only caveat is that you must make the website gracefully degrade in browsers that don't support CSS3. The com-
pany is also very aware that the web is accessed on many different types of devices (and its underfunded research de-
partment has determined socks will be able to access the web in the near future), so having a Responsive Web Design
is very important to everyone involved.
Cool Shoes & Socks has already had the HTML of the site written and handed it to you to begin implementing CSS
and modifying the HTML should that be necessary.
Getting Started with the Project Files
In a moment you will download the Cool Shoes & Socks project files that are built on throughout CSS3 Foundations .
At specific milestones in the topic, the most up-to-date project files are made available for you to reference or in case
you want to skip a section and start at a different point. These milestones are marked in the topic, along with the pro-
ject file number and a link to where you can download it.
Downloading the Project Files
Go to www.wiley.com/go/treehouse/css3foundations in your web browser, where you can download
the project files. The project files are contained within a Zip file that you should unzip into the location of your choos-
Example, I unzipped the files to the following directories:
• Windows: C:/Users/Ian/Sites/CSS3 Foundations/
• Mac: Users/Ian/Sites/CSS3 Foundations/
Folder Structure and Good Practices
When you unzip the downloaded file, you are presented with folders named website followed by a chapter and mile-
stone number, such as (ch02-00) , representing the first milestone of Chapter 2 (the one you begin with). Each website