今天来复习一下HTML 再学一下CSS


<html>
<head>
 <title>页面标题</title>
   </head>
<body>
 <h2>CSS标记</h2>
 <p>CSS标记的正文内容从这里开始</p>
</body>
</html>


<html>
<head>
 <title>页面标题</title>
   </head>
<body>
 <h2><font color="#0000FF" face="黑体">CSS标记1</font></h2>
 <p>CSS标记的正文内容1</p>
 <h2><font color="#0000FF" face="黑体">CSS标记2</font></h2>
 <p>CSS标记的正文内容2</p>
 <h2><font color="#0000FF" face="黑体">CSS标记3</font></h2>
 <p>CSS标记的正文内容3</p>
 <h2><font color="#0000FF" face="黑体">CSS标记4</font></h2>
 <p>CSS标记的正文内容4</p>
</body>
</html>


<html>
<head>
<title>页面标题</title>
<style>
<!--
h2{
 font-family:幼圆;
 color:red;
}

-->
</style>
   </head>
<body>
 <h2>CSS标记1</h2>
 <p>CSS标记的正文内容1</p>
 <h2>CSS标记2</h2>
 <p>CSS标记的正文内容2</p>
 <h2>CSS标记3</h2>
 <p>CSS标记的正文内容3</p>
 <h2>CSS标记4</h2>
 <p>CSS标记的正文内容4</p>
</body>
</html>


<html>
<head>
<title>页面标题</title>
<style>
<!--
ul{
 list-style-type:none;
 display:inline;
}

-->
</style>
   </head>
<body>
 <ul>
  <li>list1</li>
  <li>list2</li>
 </ul>
</body>
</html>


 

行内样式!!!

 

 

<html>
<head>
<title>页面标题</title>
   </head>
<body>
 <p style="color:#FF0000; font-size:20px; text-decoration:underline;">正文内容1</p>
 <p style="color:#000000; font-style:italic;">正文内容2</p>
 <p style="color:#FF00FF; font-size:25px; font-weight:bold;">正文内容3</p>

</body>
</html>


 

内嵌式!!!

 

<html>
<head>
<title>页面标题</title>
<style type="text/css">
<!--
p{
 color:#FF00FF;
 text-decoration:underline;
 font-weight:bold;
 font-size:25px;
}

-->
</style>
   </head>
<body>
 <p>紫色、粗体、下划线、25px的效果1</p>
 <p>紫色、粗体、下划线、25px的效果2</p>
 <p>紫色、粗体、下划线、25px的效果3</p>
</body>
</html>


 

链接式!!!

 

 

<html>
<head>
<title>页面标题</title>
<link href="1.css" type="text/css" rel="stylesheet">
   </head>
<body>
 <h2>CSS标题1</h2>
 <p>紫色、粗体、下划线、25px的效果1</p>
 <h2>CSS标题2</h2>
 <p>紫色、粗体、下划线、25px的效果2</p>
</body>
</html>


 

导入样式!!!

 

<html>
<head>
<title>页面标题</title>
<style type="text/css">
<!--
@import url(1.css);
-->

</style>
   </head>
<body>
 <h2>CSS标题1</h2>
 <p>紫色、粗体、下划线、25px的效果1</p>
 <h2>CSS标题2</h2>
 <p>紫色、粗体、下划线、25px的效果2</p>
 <h3>CSS标题3</h3>
 <p>紫色、粗体、下划线、25px的效果3</p>
</body>
</html>

posted on 2008-07-29 22:02  LMT  阅读(157)  评论(0编辑  收藏  举报