使用CSS的基础实例
2008-02-23 08:28:27来源：互联网 阅读 ()
原创教程，转载请注明出处：网页教学网
我们现在设计网页都要使用CSS了，今天在这个教程中给大家以实例的形式教给大家如何使用CSS，通过四个例子来说明CSS的使用！通过这个教程中的四个实例让大家理解在HTML中加入CSS之后，CSS在什么时候起作用？以及不加CSS会如何显示。激起你学习CSS的兴趣。
首先我们先建立一个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的定义，在什么地方起作用等问题。
标签：
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有
上一篇：web标准建站:CSS入门教程
下一篇：用CSS美化你的网页
IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash
