沙子 11月 5th, 2008 in CSS教程及相关应用 | tags: CSS教程及相关应用, 教程, 样式表
网页设计CSS XHTML思想入门教程 之二 认识样式表(CSS)
2 认识样式表(CSS)
什么是样式表(CSS)？
*CSS是Cascading Style Sheet 的缩写。译作“层叠样式表“。是用于（增强）控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。
*CSS语言是一种标记语言,它不需要编译,可以直接由浏览器执行(属于浏览器解释型语言，就是告诉浏览器这里是什么样子的) 。
* 在标准网页设计中CSS负责网页内容(XHTML)的表现。
* CSS文件也可以说是一个文本文件,它包含了一些CSS标记,CSS文件必须使用css为文件名后缀。
* CSS是由W3C的CSS工作组产生和维护的。
样式表能做什么？
可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。
只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。
它的作用几乎可以达到：
（1）在几乎所有的浏览器上都可以使用。
（2）使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目。
（3）你可以轻松地控制页面的布局 。
首先，CSS对网页设计师并不友好，要想实现上边的三条你必须要对样式表非常熟悉，并且不同的浏器对于样式表的理解在一些地方也不一样（因为这些浏器的开发者并不是一家公司或一个人）。不过没关系，我们以后的学习会一步步的把这些问题解决掉。
CSS的语法
CSS的定义是由三个部分构成:
选择符(selector)，属性(properties)和属性的取值(value)。
语法: selector {property: value} (选择符 {属性:值})
例：body {background-color: #ff0000;}
这个例子是把body的背景色显示为红色，body是什么？看看前面我们讲的,body是我们写内容的标签，没错，就是把整个儿页面背景变成红色，#ff0000是属性值代表红色的十六进制值，如果您有PhotoShop可以查看这个值。
background-color这个属性就是指背景色了，如果您英文不好的话，建议您下载 苏沈小雨 编写的CSS2.0中文手册。不懂的英文属性就可以直接查出来了。
下面我们把这个样式表加入我们前面写的页面中看看效果。
<html>
<head>
<title>我的第一个网页</title>
<style type=”text/css”>
<!–
body {background-color: #ff0000;}
–>
</style>
</head>
<body>世界你好
</body>
</html>
注意观察一下样式表写在哪了？这几行代码比前面的多了哪些？
这一种叫做“内嵌样式表 ”这种样式只对当前的HTML文档起作用，我们在以后的很长时间都会用这种方式书写，如果您是一位心急的人，您可以在网上搜索一下，“外联式样式表” 和“导入样式表”其中外联式样式表是网页制作中用得最多的 。
好吧来看看网页的变化：
再往里边加两个属性：font-size:20px;color:#ffffff;
注意：每条属性之间要用英文分号分开
看看有什么变化
不知道加在哪？
<html>
<head>
<title>我的第一个网页</title>
<style type=”text/css”>
<!–
body {
background-color: #ff0000;
font-size:20px;
color:#ffffff; }
–>
</style>
</head>
<body>世界你好
</body>
</html>
这就是样式表，到这里您应该了解：
1 CSS的定义是由三个部分构成
2 我们以后的一段时间用内嵌样式表方式书写
3 CSS能做什么
