本文介绍了CSS的发展历程，从CSS1.0到CSS3.0，概述了快速上手方法，强调了内容与表现分离、复用性等优势，并讲解了行内、内部、外部样式和@import导入的四种方式。
本次博客带领学习什么是CSS、CSS的发展史、快速入门、优势和四种导入方式。
什么是CSS
-
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
-
CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
CSS的发展史
-
1996年，w3c制定发布了第一个css1.0（层叠样式表）版本，该版本在99年的时候，有过一次修正，该版本主要它提供了一些简单的样式表机制，让程序员可以通过style这些标签，或者是标签上面的某些属性针对标签内容进行控制。
-
1998年5月份，w3c又发布了第二个css2.0（层叠样式表）版本，该版本在包含1.0的版本基础上，扩展了并改进了很多更强大的属性，css2.0支持多媒体样式表，可以让程序员根据不同的输出设备给网页文档指定不同的层叠样式表。
-
2001年5月份，w3c发布了第三个css3.0（层叠样式表）版本，css3.0开始遵循模块化开发，该标准将整个网页系统划分为很多的相互独立的子模块，然后让程序员根据不同的模块进行开发与设计对应的层叠样式表，用来减少css文件的体积。
快速入门
规范,<style> 可以编写css代码，每一个声明，最好使用分号结尾
语法：
选择器{
声明1;
声明2；
声明3；
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--规范,<style> 可以编写css代码，每一个声明，最好使用分号结尾
语法：
选择器{
声明1;
声明2；
声明3；
}
-->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1>我是标题</h1>
</body>
</html>
h1{
color: red;
}
CSS的优势
- 内容和表现分离。
- 网页结构表现统一，可以实现复用。
- 样式十分的丰富。
- 建议使用独立于html的css文件。
- 利用SEO，容易被搜索引擎收录。
四种导入方式
- 行内样式：在标签元素中，编写一个style属性，编写样式属性即可。
<!--行内样式：在标签元素中，编写一个style属性，编写样式属性-->
<h1 style="color: red">我是标题</h1>
- 内部样式：
<style>
h1{
color: green;
}
</style>
- 外部样式：
<link rel="stylesheet" href="css/style.css">
h1{
color: yellow;
}
- 导入样式：
<style>
@import url("css/style.css");
</style>
- 其中上面的四种导入方式的优先级是就近原则，哪个离标签近就使用那种导入方式。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
