一、CSS概述
CSS通常称为CSS样式或样式表，主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。
如下图所示，图中文字的颜色、粗体、背景、行间距和左右两列的排版等，都是通过CSS控制的
二、. CSS发展历史
-
CSS1
1996年12月W3C发布了第一个有关样式的标准CSS1。包含了font的相关属性、颜色与背景的相关属性、文字的相关属性、box的相关属性等。 -
CSS2
1998年5月，CSS2正式推出，开始使用样式表结构，是目前正在使用的版本。 -
CSS2.1
2004年2月，CSS2.1正式推出。它在CSS2的基础上略微做了改动，删除了许多不被浏览器支持的属性。 -
CSS3
早在2001年，W3C就着手开始准备开发CSS第三版规范。虽然完整的、规范权威的CSS3标准还没有尘埃落定。但是各主流浏览器已经开始支持其中的绝大部分特性。三、样式规则
使用HTML时，需要遵从一定的规范。CSS亦如此，要想熟练地使用CSS对网页进行修饰，首先需要了解CSS样式规则
具体格式如下：选择器{属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
CSS代码结构中的几个特点，具体如下：
- CSS样式中的选择器严格区分大小写，属性和值不区分大小写，按照书写习惯一般将“选择器、属性和值”都采用小写的方式。
- 多个属性之间必须用英文状态下的分号隔开，最后一个属性后的分号可以省略，但是，为了便于增加新样式最好保留。
- 如果属性的值由多个单词组成且中间包含空格，则必须为这个属性值加上英文状态下的引号。
- 在编写CSS代码时，为了提高代码的可读性，通常会加上CSS注释。 在CSS代码中空格是不被解析的，花括号以及分号前后的空格可有可无。
四、引入CSS样式
（1）行内式
行内式也称为内联样式，是通过标记的style属性来设置元素的样式，其基本语法格式如下：
<标记名 style=“属性1:属性值1; 属性2:属性值2; 属性3:属性值3;”> 内容 </标记名>
该语法中style是标记的属性，实际上任何HTML标记都拥有style属性，用来设置行内式。其中属性和值的书写规范与CSS样式规则相同，行内式只对其所在的标记及嵌套在其中的子标记起作用。
（2）内嵌式
内嵌式是将CSS代码集中写在HTML文档的头部标记中，并且用<style>标记定义，其基本语法格式如下：
<head>
<style type="text/css">
选择器 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
</style>
</head>
该语法中，
<style>标记一般位于<head>标记中<title>标记之后，也可以把它放在HTML文档的任何地方。
（3）链入式
链入式是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中，通过<link />标记将外部样式表文件链接到HTML文档中，其基本语法格式如下：
<head>
<link href="CSS文件的路径" type="text/css" rel="stylesheet" />
</head>
该语法中，
<link />标记需要放在<head>头部标记中，并且必须指定<link />标记的三个属性，具体如下：
href：定义所链接外部样式表文件的URL，可以是相对路径，也可以是绝对路径。
type：定义所链接文档的类型，在这里需要指定为“text/css”，表示链接的外部文件为CSS样式表。
rel：定义当前文档与被链接文档之间的关系，在这里需要指定为“stylesheet”，表示被链接的文档是一个样式表文件。
五、简单CSS实例
<htmL>
<head>
<title>CSS体验</title>
<style type="text/css">
h1{
text-align: center;
color: red;
font-family: "微软雅黑";
}
p{
text-align: center;
color: blue;
font-size: 20px;
}
</style>
</head>
<body>
<h1>成功法则</h1>
<p>迟到毁一生</p>
<p>早退穷三代</p>
<p>按时上下班</p>
<p>必成高富帅</p>
</body>
</html>
895
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
