セレクタ（Selector）に対して、プロパティ（Property）と値（Value）を定義づけます。プロパティ：値を宣言（Declaration）と呼び、間に：コロンを置きます。宣言は；セミコロンで区切ることで複数定義することができます。空白（タブも含む）は無視されるので、エディタで好きなようにレイアウトすることが可能です。
HTML文書へのスタイルシートの設定方法を、下記の例で説明します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>STYLE SHEETS</TITLE>
<META http-equiv="Content-Style-Type" content="text/css">
<LINK REL="stylesheet" TYPE="text/css" HREF="style.css">
<STYLE TYPE="text/css">
BODY { color: green ; background-color: pink ; }
H1 { color: red ; }
P { background-color: white ;}
</STYLE>
</HEAD>
<BODY>
<H1>文字は赤、背景はピンク</H1>
<P>文字は緑色、背景は白になります。</p>
<P style="color : blue">この文字は青になります。</p>
</BODY>
</HTML>
まず、HTML文書で使用するスタイルシートがどんなものであるかを宣言します。次の一文をHEAD要素の内容として書いておきます。CSSでは、スタイルシートのMIMEタイプ（"text/css"）を定義しておくことを推奨していますので、この1行は必ず入れておきましょう。
<META http-equiv="Content-Style-Type" content="text/css">
HTMLファイルとは別の拡張子.cssとなるファイルでスタイルを定義しておく方法で、LINK要素で設定しています。
<LINK REL="stylesheet" TYPE="text/css" HREF="style.css">
このように、スタイル定義をHTMLファイルと分けておくことで、同じスタイル定義を複数のHTMLファイルで共有することができ、サイト全体の見栄えを統一するのが簡単になります。
外部ファイルの"style.css"の内容は次のような書き方になります。
/* 外部スタイルシート、ファイル名：style.css */
/* フォント */
body { font-size : 15px; }
blockquote { font-size : 13px; }
/* このコメントは
複数行で使えますが、入れ子にはできません */
style.cssは、HTMLファイルではないので<!-- HTMLのコメント -->は使えません。その代わりにコメントを表すのが/* この中がコメント */です。コメントのつけ方はスタイルシートがC言語、JavaScriptがC++と同じと覚えます。
HTMLファイルの中でスタイルを定義する場合はSTYLE要素で定義します。そのHTMLファイルでだけ定義したいスタイルがある場合などでは、HTMLファイル内にスタイル定義があるのでスタイル定義の理解がしやすくなります。これを置く場所は<HEAD>〜</HEAD>に記述します。
<HEAD>
<STYLE TYPE="text/css">
<!--
BODY { color: green ; background-color: pink ; }
H1 { color: red ; }
P { background-color: white ;}
-->
</STYLE>
</HEAD>
ここで、ブラウザによってはスタイル定義の内容が表示されることがあるので、それを防止するため、定義内容を<!-- コメント化 -->しておくことをお薦めします。
最も簡単なスタイルの定義としてstyle属性を利用する方法があります。宣言を""に入れることで定義ができます。セミコロン;で区切ることで複数の宣言も可能です。HTMLファイルで単独で使いたい場合には、これのほうが分かりやすい場合もあります。
<P style="color : blue">この文字は青になります。</p>