之前给大家分享的是HTML的入门基础，从今天起，我给大家分享关于CSS的内容。
CSS是什么？
CSS，英文名词 Cascading Style Sheet，中文意思层叠样式表，是用来控制网页外观的技术。在前端技术中，HTML，CSS，JavaScript是最核心的三个元素。
HTML控制网页的结构，CSS控制网页的外观，而JavaScript控制网页的行为。在网页发展的初期，网页仅仅使用HTML标签来制作，内容单调。CSS的出现就是为了改造HTML标签在浏览器展示的外观，使其更好看，更生动。
CSS和CSS3？
CSS3是CSS的升级版。CSS版本依次是CSS 1.0，CSS 2.0，CSS 2.1和CSS 3.0，其中CSS 2.1是CSS 2.0的修订版，而CSS 3.0是CSS的最新版本。CSS 3.0相对于CSS 2.0来说，新增了很多属性和方法，但是此次我给大家分享的主要内容是CSS 2.1。
CSS的三种引用方式
在HTML中，引入CSS共有三种方式，分别是外部样式表，内部样式表，内联样式表。
1、外部样式表
外部样式表是最理想的CSS引用方式，在实际开发中，为了提高网站的性能和维护性，一般都是使用外部样式表。所谓的外部样式表，就是把CSS代码单独放在一个文件中，然后通过HTML文档中link标签，导入样式表。
语法：
<link href="文件路径" rel="stylesheet" type="text/css">
示例代码：
<html><head><title>外部样式表</title><link href="1.css" rel="stylesheet" type="text/css></head><body><div></div></body></html>
link标签，是在head内部使用的，通过导入css文件，来达到代码分离的目的。
2、内部样式表
内部样式表，就是HTML代码和CSS代码在同一个文件中。css代码放在<style></style>标签内，并且把<stytle></style>放在<head>内部。
语法：
<style type="text/css">......</style>
示例代码：
<html><head><title>内部样式表</title><stytle type="text/css">div{.......}</style></head><body><div></div></body></html>
对于内部样式表，css样式代码必须放在style标签内部，并且style放在head内部。
3、内联样式表
内联样式表，也是把HMTL和CSS代码放在一个文件中，但是不是放在<head>内部，而是通过<style>标签放置在HTML的各个元素标签内。
语法：
<div style="width:100px;height:100px;"></div>
示例代码：
<html><head><title>内联样式表</title></head><body><p style="color:Red">CSS入门基础</p><p style="color:blue">CSS入门基础</p><p style="color:green">CSS入门基础</p></body></html>
大家注意观察，内联样式表直接对所在标签起作用，如果需要标签实现效果，需要针对每个标签都写css代码，容易造成冗余，维护css代码时还需要找到标签，这对于维护大型网站来说，工作量大，还容易出错。
在HTML入门学习时，不建议大家使用Dreamweaver那种“点点点”的方式开发网页，该工具生成的网页代码均是使用的内联样式代码，后期维护起来非常麻烦，冗余较多，也不便于初学者理解。
在实际开发中，我们都会使用外部样式表，这样代码分离，需要修改样式时，只需要修改css样式代码文件，网页就会自动产生效果，很方便。但是分享学习过程中，我会使用内部样式表的方式，因为这样CSS代码和HTML代码在同一个文件中，方便修改和测试。
插一句，除了上面提到的三种引用方式，CSS还有一种@import方式，这种方式类似于外部样式表的调用，但是在实际开发中，极少用到@import方式，原因在于，@import方式先加载HTML后再加载CSS，link方式是先加载CSS后加载HTML，如果HTML先与CSS加载，网页的观感会非常差，影响用户体检，所以一般我们都是使用link方式。
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
