首先我們先建立一個CSS文件，打開我們的記事本，然後輸入下面的內容：
p
{
color: #ff0000;
background: transparent;
}
然後保存為style1.css(在這個CSS文件中我們定義p標簽的的風格為紅色、背景透明)
實例1：把下列文件保存為.htm文件，注意要和style1.CSS保存在同一目錄中。
<Html>
<head>
<title>*實例教程1</title>
<link href="style1.css" rel="stylesheet" type="text/CSS" />
<style type="text/CSS">
p
{
color:#00ff00;
background:transparent;
}
</style>
</head>
<body>
<p style="color:#0000ff;background:transparent;">蘭色文本顯示 </p>
</body>
</Html>
實例2：
<Html>
<head>
<title>*CSS實例2</title>
<link href="style1.css" rel="stylesheet" type="text/CSS" />
<style type="text/CSS">
p
{
color:#00ff00;
background:transparent;
}
</style>
</head>
<body>
<p>綠色文本顯示</p>
</body>
</Html>
實例3：
<Html>
<head>
<title>*CSS實例3</title>
<link href="style1.css" rel="stylesheet" type="text/CSS" />
</head>
<body>
<p>紅色文本顯示</p>
</body>
</Html>
實例4：
<Html>
<head>
<title>*CSS實例4</title>
</head>
<body>
<p>默認的浏覽器顯示的文本</p>
</body>
</Html>
通過以上四個實例大家理解CSS的定義，在什麼地方起作用等問題。