CSS

BACK: Navigation

This page is running:

<style>
  p {
    color: blue;
    font-size: 50px;
  }

  .top{
    color:red;
    font-weight: bold;
  }

  #intro {
    background-color: red;
  }
</style>

Select by tag: (p)

All <p> tags will now have the following as its default behavior:

p {
  color: blue;
  font-size: 50px;
}

<p>Hello World</p>

Hello World

Select by Class (.class)

However, we can make this more specific. If we want specific <p>’s to behave with a certain style we can define a class using #class.

.top {
  background-color: #ccc;
}

<p class="top">Hello World</p>

Hello World

Select by ID (#id)

We can be even MORE specific by doing:

#intro {
  color: red;
  font-weight: bold;
}

<p id="intro">Hello World</p>

Hello World