Facebook Twitter LinkedIn RSS
Home tutorial The “style.css” file annotated (for Project 2)
formats

The “style.css” file annotated (for Project 2)

Published on September 18, 2012, by in tutorial.

Here I took screenshots of the style.css file we use for Project 2. This file can be find in the article Two Basic CSS Templates. Note the css file I explain here is the horizontal navigation. The css file of the vertical navigation is slightly different. Another related article you should read is CSS Basics.

 

1. Styling the html tag <body>

 

 

 

 

2. Styling the four states of the html tag <a>.

 

 

 

 

 

 

 

 

3. Styling html tags <h1> and <h2>. (this also mean we did not style our h3, h4, h5, h6.)

 

 

 

 

 

 

 

4. Styling html tag <p>.

 

 

 

 

5. Styling html tags <footer>, <header>, <nav>, and <section>.

 

 

6. Styling a html tag <div> that has the id “container. In other words, styling <div id=”container”>

 

 

7. Styling html tag <header>

 

 

 

 

8. Styling html tag <nav>.

 

 

 

 

 

9. Styling the four states of <a> that is within <nav>…</nav>. (here we see that we can style a tag differently when the tag is in different area on a web page.)

 

 

 

 

 

 

 

 

 

10. Styling html tag <section>

 

 

 

 

 

11. Styling html tag <footer>

 

 

 

 

 

12. Styling html tag <img> that is within <p>, within <section>, within <div =”container”>.

 

 

 
Tags: ,

3 Responses

  1. […] Web Design & Publishing School of Journalism & Mass Comm – Texas State University Skip to content HomeScheduleSyllabusAssignmentsAboutContact ← The “style.css” file annotated (for Project 2) […]

  2. […] When we click on the “style.css” tab, we see the actual content of our css file. To understand the css code, please read (1) CSS Basics (2) style.css annotated. […]

© Web Design & Publishing