本篇博客我打算大略的讲解一下css的大概内容，比如css引入方式，css的一些颜色表达方式

一、css引入方式

在css中，有三种常用的css引入方式，还有一种不太常用的引入方式

1、内联（行间样式）

行间样式就是在一行代码的后边加style，对标签的样式进行设置
理论不如实践，我们看个小例子吧

<div class = 'haha' style = 'width:200px;height:100px;background:red'></div>

效果1：

### 2、style内部引用引入方式
内部引入方式就是在文档头部引入一段css样式的代码，例如

<style type = ‘text/css>
div{
border:1px solid blue;
width:100px;
height:50px;
}

在body部分加入下列代码

效果如下：

3、外部引入

在html中从外部引入一段css样式，可以使用link，link有3个常用的属性，一个是href，表示链接的css的url地址；一个是type，表示的是链接文件的类型；，三就是rel，表示文档与链接文档之间的关系，光说不练假把式，下边我们再来看个小例子：

<link rel = 'stylesheet' href = 'index.css' type = 'text/css'/>

4、三种引入方式的优缺点

1、行间样式：优先级最高，但是不能复用，样式内容不分离

2、内部引入：样式内容分离，复用性能不高

3、外部引入：样式内容分离，复用性能好，但是在载入文档的时候需要多一次请求

二、css的五种颜色表达方式

1、英文单词

比如blue、green、red、white、black等.实例如下，虽然很好记，很好用，但是，数量少，不易我们的颜色多样化

<div style = 'width:50px;height:30px;background:red'></div>

结果

2、十六进制

在css中有很多中颜色表达方式，十六进制在以后工作中很常用，我们大部分都会使用十六进制，因为这样的颜色更为准确

<div style = 'width:50px;height:30px;background:#ccc'></div>
结果

3、三原色rgb函数

所有的浏览器都支持rgb颜色值，rgb颜色值是这样定义的：rgb(red,green,blue)，每个颜色的强度，可以说是介于0-255之间的整数，或者是百分比。来个梨子给大家尝尝：

<div style = 'width:50px;height:30px;background:rgb(233,23,245)'></div>    

结果

4、rgba函数

rgba与rgb的区别就在于多了个a，也就是Alpha透明度，这是个很好的东西啊，我们以后要实现半透明的效果,这个比上一个效果看起来更为舒服，正如上表所展示的，ie8及其以下都对实用的rgba不支持，ie8以下，我们要对用以下进行设置 filter:alpha(opacity=50);

<div style = 'width:50px;height:30px;background:rgba(233,23,245,0.5)'></div>    

结果

### 5、hlsa函数
H：Hue(色调)。0(或360)表示红色，120表示绿色，240表示蓝色，也可取其他数值来指定颜色。取值为：0 - 360
S：Saturation(饱和度)。取值为：0.0% - 100.0%
L：Lightness(亮度)。取值为：0.0% - 100.0%
A：Alpha透明度。取值0~1之间。


结果