DES 3005 - Web Design I

  DES 3005 - Web Design I

 

Week Nine | Part Two

A Few Basic CSS Terms

A selector is the name of the element being styled. When you put < > around a selector and use it to markup your Web page, it becomes a <tag>. Some common selectors you've already used include:

p , h1 , td , strong

A property is what you want to create or modify for a selector. For example:

font-family , color , font-size

A value is the styling applied to the property. For example:

font-family: arial; color: blue; font-size: 12px;

Preparing a Style Sheet

The first bit of business is to set up your Web page so that it knows you will be using a style sheet. For a document level (also known as an embedded) style sheet, you write the information in the <head> of your Web page:

<head>
<title>My Page Title</title>
<style type="text/css">
<!--
p { font-family: Verdana, sans-serif;}
-->
</style>
</head>

 

Style sheets are very particular about how you code them. Get the spaceing and placement of characters wrong, and the selector might not work. So pay close attention to your code!

The comment line (<!--) after <style type="text/css"> prevents older Web browsers from looking at the additional code in the <head> and trying to display it. Be sure to close ( -->) the comment tag, otherwise the browsers won't be able to display the content of your page!

 

Please go to Week Nine Part 3 ».