Strangely enough, the actual CSS styles are something we haven't discussed at all yet! CSS styles are the actual styles used to change the look of tags. CSS styles consist of two things: properties and values. Using these CSS styles, you can visually change nearly anything on your Website! Some css properties may include:

  • Color: - Selects the font color
  • background-color: - changes the background color
  • font-size: - changes the font size (this can be px, pt, em, in, %, etc.)
  • float: - floats the information to a specified side of the screen
  • text-align: - aligns the text a specified way

For more CSS properties please visit our list of CSS properties.

The number of CSS properties is endless, so you can imagine how many value there are for each of them!

For example, color can accept "green", "red", "blue", as well as hexadecimal codes. font-size can accept any number you enter, as long as you specify the unit of measurement. Here are a few CSS examples.

H1{ color:black;
Text-align:left;}

H2{
Color: red;
Text-size: 20px;
/*background-color: #000080; */
}

#MyID{ float:left; position: absolute; }

.MyClass{font-size: 100px;
Margin-top: -100px; }

A:hover{color: green;}

Note that I can even use pseudoclasses with class names! For example:

.Myclass:hover{color: blue;}

NOTE: In some RARE situations, CSS does not work the way you want it to. The hierarchy of your CSS can fail you. If this happens, you can add "!important;" after your CSS style value. THIS IS NOT RECOMMENDED!

Congratulations! This is the end of our CSS tutorial. To see CSS examples of any page you could ever go to EVER, please visit our Browser Development page!

Also, if you wish to learn about Bootstrap and building responsive websites, please visit our Responsive Design section.

Previous

Startup Discount
Small Business?
Contact us for an Enormous Discount!