<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS简介</title>
</head>
<hr>
<head>
<title>使用外部CSS</title>
<link href="css/styles.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<h1>potatoes</h1>
<p>There are dozens of different potatou varieties.They are usually described as early,second early and maincrop potatoes.</p>
</body>
<hr>
<head>
<title>使用内部CSS</title>
<style type="text/css">
body{
font-family:arial;
}
h1{
color:rgb(255,255,255)
}
</style>
</head>
<body>
<h1>potatoes</h1>
<p>There are dozens of different potato varieties. They are usually described as early, second early and maincrop potatoes.</p>
</body>
<hr>
<head>
<title>CSS选择器</title>
</head>
<body>
<h1><a id="top"><font color="black">Kitchen Garden Calrndar</font></a></h1>
<p id="introduction">Here you can read our handy guide about what to do when.</p>
<h2><font color="black">Spring</font></h2>
<ul>
<li><a href="mulch.html">Spring mulch vegetable beds</a></li>
<li><a href="potato.html">Plant out early potatoes</a></li>
<li><a href="tomato.html">Sow tomato seeds</a></li>
<li><a href="beet.html">Sow beet seeds</a></li>
<li><a href="zucchini.html">Sow zucchini seeds</a></li>
<li><a href="rhubarb.html">Deadhead rhubarb flowers</a></li>
</ul>
<p class="note">This page was written by<a href="mailto:jon@examole.org">jon@example.org</a>
for<a href="http://www.wiley.com">wiley</a>.</p>
<p><a href="#top">Top of page</a></p>
</body>
<hr>
<head>
<title>CSS规则如何联级</title>
<style typy="txt/css">
*{
font-family:Arial,Verdana,sans-serif;}
h1{
font-family: "Courier New",Courier,minispace;}
i{
color:green;}
i{
color:red;}
b{
color: pink;}
pb{
color:blue !important;}
pb{
color: violet;}
p#intro{
font-size:100%;}
p{
font-size: 75%;}
</style>
</head>
<body>
<h1>potatoes</h1>
<p id="intro">There are<i>dozens</i> of different<b>potato</b>varieties.</p>
<p>They are usually described as early, second early and maincrop potatoes.</p>
</body>
<hr>
<head>
<head>
<title>继承</title>
<style type="text/css">
body {
font-family: Arial, Verdana, sans-serif;
color: #665544;
padding: 10px;}
.page {
border: 1px solid #665544;
background-color: #efefef;
padding: inherit;}
</style>
</head>
<body>
<div class="page">
<h1><font color="black">Potatoes</font></h1>
<p>There are dozens of different potato varieties.</p>
<p>They are usually described as early, second early and maincrop potatoes.</p>
</div>
</body>
</html>