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

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