Wednesday, October 28, 2015

Week 10B

Today in class we started talking about CSS (Cascading Style Sheets) and how to use them to style our web page. There are three different ways of using CSS:

  1. Inline, this is where you put the style you want within the tabs of your html page
  2. Embedded, this is when you put all the styling within the head tag so it covers the whole page
  3. External, this is the most commonly used. It is when you create a separate CSS document and write the coding for each part you want to style and connected it to your html page through a link in the html coding.

Link in html when using External CSS coding:


There are different parts of the CSS Syntax; there is there selector, the declarations, the property, and the value.

Within CSS coding there are three different ways to style what is in your html.

There is simply typing the tab name and styling it:



(view of webpage)

There is using classes. Classes are not very unique,  the same class can be used on multiple elements and multiple classes can be used on the same element.


(this is how you insert it into your html)

And then there are IDs, which are very unique. Each element can only have one ID and each page can only have one element with that ID.

(this is how you insert it into your html, don't forget to close! </div>)

Before creating an external CSS document to create all the styling, using inline CSS this is what the homework from last class looked like:




We used this in order to style our made up resumes that were homework from last class. All the styling you see here is done through a separate CSS file:



This is what the whole CSS document looks like as of now:





No comments:

Post a Comment