Making a Page January 20, 2015
- Classes and IDs (as a class)
- Basic Page Layout (as a class)
- Getting Started with the Fashion Blog (as a class)
- Fashion Blog Alpha (in pairs)
Class and IDs (on Codepen)
We’ll work as a class to explore the
Basic Page Layout (on Codepen)
We’ll start using
float for very basic page layouts (to be used more next class).
Fashion Blog Alpha (download) (preview)
Beginning with the starter files, flesh out this blog homepage to look like the preview linked to above. We’ll discuss this first as a class.
The red color for links is
#D00. On hover, they turn to
The fonts used on the site are from Google Fonts. Please read there to see how to set these up properly. It should be fairly straightforward. This site is using:
- Lato Light
- Lato Light Italic
- Lato Bold
- Lato Bold Italic
There are a slew of grays being used on the page, including (from lightest to darkest):
Please look over the MDN CSS reference, with a focus on these:
For the Fashion Blog project, I’d also recommend looking at
Of course, if you feel like exploring more, please feel free.