Cascading Style Sheets Class 2, Lecture 3 Rachel A Ober [email protected].
-
Upload
shavonne-mitchell -
Category
Documents
-
view
212 -
download
0
Transcript of Cascading Style Sheets Class 2, Lecture 3 Rachel A Ober [email protected].
Using “display: inline”
W3 Schools does it best… http://www.w3schools.com/css/tryit.asp?filen
ame=trycss_display
How to Structure
If you’ve peeked at some of my code, you’ll see I make use of <div> tags a lot.
You can also use <span> tags for short passages you’d like to change.
Possible Structures
Separate Header elements from Content and Footer.
You may also want to include a Navigation element.
Break up your page into logical organizations. This way, you can manipulate many different parts of the document or the whole document.
Design
If you have a good document design, you can just change the style sheet whenever you want to change your design. You won’t even have to touch your HTML again!
Tables vs. DIVs
Tables aren’t very flexible when designing pages.
DIV tags can be directly manipulated through CSS.
What if your manager wants the design of a page to change and everything is controlled by tables? What if he wants the bottom row of every design to now be at the top?
Example 1
http://cpu.rachelober.com/lecture3/example1.html
Common Layout Suggestions
http://www.intensivstation.ch/en/templates/
Lab #3: Designing Without Tables
http://cpu.rachelober.com/lab3 Objective:
Change a <table> layout into a <div> layout! Stock Images for use:
http://cpu.rachelober.com/stock