初学CSS的基础教程:在网页中使用CSS
行为：通俗理解为人（用户）与网页的交互，比如：我在页面的某个元素上单击一下鼠标，页面会给我什么反应——这就是一个简单的人与网页的交互，我们也可以大体理解为人与机器的交互，交流，沟通（这几个词可能不太准确，请原谅偶在汉语辞藻方面的贫乏）。目前主要表现行为的技术是各种所谓的脚本技术，比如：javascript（当前那是相当流行啊）。
从上面我们可以看出，用于控制内容表现形式的代码（红色部分）是和内容部分混杂在一起的，也就是说，二者互相混杂，不可分割。现在我们再来看看使用css后的代码：
注：上面的代码如果看不懂也没关系，后面我们会深入的讲解。 从上我们可以看出，使用CSS后可以将内容（红色部分）和表现（css部分）区分开来，只要你愿意，你甚至可以将CSS部分和HTML部分分别做成2个不同的文件，存放在不同的文件夹下。很显然，使用CSS将结构和表现分离后的代码维护方便，逻辑清晰，有条理，而且，我们甚至还可以把一个CSS文件应用给多个不同的HTML文件，来控制他们的外观，可以有效减小站点的体积。
上面我们简单介绍了CSS是什么和它能用来干什么的问题，那么我们如何才能在网页制作中使用CSS技术呢？ ---------------------------------------------更加华丽的分割线-------------------------------------------------- 第二个问题：在网页制作中运用CSS技术的几种方法：
CSS按其类型可以分为3类：
•内嵌样式 •内部样式 •外部样式
这三类也分别代表了运用CSS的3种不同方法，首先来看第一种方法：
1、内嵌样式(Inline Style) Inline Style是写在标签里面的，内嵌样式只对所在的标签有效。 看如下例子：
<html> <body> <P style="font-size:20pt; color:red">这个内嵌样式(Inline Style)定义段落 里面的文字是20pt字体，字体颜色是红色。</p> <P>这段文字没有使用内嵌样式。</p> </body>
本例在浏览器中显示效果如下：
如上图，我们可以看到，这种方式使用CSS是将style作为HTML标签的一个属性加入的，也就是说，它还是没有真正的把结构和表现分开，所以，这种方法用的比较少。下面我们来看第二种方法：
2、内部样式(Internal Style Sheet) 内部样式是写在网页的<head></head>标签对中的，内部样式只对当前运用该样式的网页有效，在网页中使用内部样式的基本语法如下：
注：上图绿色部分就是CSS代码，注意它是如何加入到页面中的，至于具体这些CSS代码如何书写，这个是我们后面要学习的内容，现在可以先不管它。下面我们来看第三种方法： 3、外部样式(External Style Sheet)
如果很多网页需要用到同样的样式（回想我们以前在DREAMWEAVER中学习的模板），用什么方法呢？我们可以将样式写在一个以.css为扩展名的文件中，然后在每个需要用到这些样式的网页中引用该文件就可以了，这种方法就是外部样式表方法。那么，我们如何才能在一个页面中引用事先准备好的样式表文件呢？通常我们有2种方法，一种称为“链接”，另一种称为“导入”，这里我们先介绍“链接”的方法，另一种在后面的学习中再去理会。在一个页面中“链接”一个样式表文件的语法格式如下：
注意：上图中的URL是指的被引用的CSS文件的URL，而且LINK语句还有别的属性，这里暂时先不加以说明，后面我们学习到的时候再详细讨论。 补充说明：被引用的CSS样式文件中应该只有基本的CSS语句，不要其他任何东东。例如我们要实现和第一个例子一样的效果，我们可以新建一个记事本文件，输入如下代码：p{font-size:20pt;color:red}然后将这个文件的扩展名改为"css"，这样就做好这个样式文件了。至于这条语句究竟是什么意思，相信聪明的你已经猜到了，对的，没错，它的意思是将所有的P标签（段落）中的文本外观变为字号：20PT，颜色：红色，当然了，如果实在不明白也没关系，后面我们会一一介绍。 ---------------------------------------------本小节最后一条分割线-------------------------------------------------- 3种样式表使用方法对比： 使用外部(Extenal)样式表，相对于内嵌(Inline)和内部式(Internal)的，有以下优点 ：
---------------------------------------------SORRY，还有一条分割线，哇哈哈哈------------------------------- 课外练习： 将上面介绍的几种方法逐一实现，理解每种方法的原理，脑袋里面多问自己几个问题，想想每种方法各自有什么优缺点。 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
