WDS 09: CSS Advanced – 03/24/17

– Make sure you understand the “Z-index”. Try either example shown in class.
– Create a 2 Column layout using HTML/CSS
– Create a 3 Column layout using HTML/CSS
– Try a JS Drop down menu
– Try CSS Drop down
– Try Media query (color change)

Chapter 12
– Can also import fonts
Can also use Google Fonts
Some Examples

From Chapter 16, rollovers.
JS tried and true.
Better but tricky
Something easier…
More Info
What’sdisplay block”?

Ch. 17
The old
The new
How it works
Older Browser?

Flavor FAVicon
Favicon generator

More Media Rules

Studio 09: CSS/HTML
Read: Chapter 9
Complete Code review for 9
In Class:
– Import and display fonts
– Try an image Roll-over (javascript or CSS)
– HTML5 Code (make sure you have tried it)
– Try a Favicon
– RWD tutorial
Start Working on your Final – Planning