一、开始学习CSS，为网页添加样式

1、CSS

CSS是一个很神奇的东西，设计者可以通过修改样式表的定义而使网页呈现出完全不同的外观。

Html4的时候，w3c组织将HTML的结构和样式做了分离:

（1）前端三层：

  HTML        结构层，搭建网页的整体结构
  CSS         样式层，装饰页面
  JavaScript  行为层，一些页面交互效果
这三层标准都是由w3c组织来维护
CSS发展到现在，最新版本是CSS3，最常用的还是CSS2.1版本

（2）CSS作用:

CSS两个重要概念：层叠式，样式

样式：HTML标签在页面的显示效果
某一个标签有什么样式，直接将对应的属性值罗列出来

CSS样式设置的时候，有两个关键：选择器、样式表

CSS作用细化：
  ①给文本添加文字显示样式
  ②给盒子添加属性进行结构布局

（3）CSS几个小属性:

①文本样式:

字体、颜色、大小

大小：font-size  本身是一个复合属性font，里面的单一属性，需要用font单一属性名。
   属性值：以像素为单位  font-size:30px;
颜色：color  属性有几种选择方案：十六进制，RGB,rgba,颜色名（英文）
    红色red
    橙色orange
    黄色yellow
    绿色green
    青色cyan
    蓝色blue
    紫色purple
    白色white
    黑色black
    粉色pink
    金色gold
    浅蓝色lightblue
    黄绿色yellowgreen
    天蓝色skyblue

    白色的几种表示方法：#fffff    rgb(255,255,255)   white

字体：font-family  复合属性的一个单一属性。中文字体和英文字体
  书写的时候将英文字体写在前面，中文字体在后面
  英文字体常用：Arial,consolas
  中文字体：默认字体为宋体，常用字体有宋体、微软雅黑。所有电脑都有宋体，写字体是标注好备选字体。

  font-family:"Arial","隶书","微软雅黑","宋体";
  浏览器首先检索英文字体  在给中文检索字体时，若电脑上没有设置的第一个中文字体，则自动检索下一个中文字体。
字体用引号包裹，字体之间用逗号隔开，表示或为了追求加载速度，将一些中文字体名字用英文书写:
    微软雅黑： Microsoft Yahei
    宋体：     SimSun

②盒子实体化基本属性

实体化：将盒子给宽、高、背景色、边框
宽度：width  属性值是像素为单位
高度：height   属性值是像素为单位
背景色：background-color  属性值就是颜色的色值
边框：border  复合属性，有多个属性值，属性值之间用空格隔开，边框的宽度、颜色、线的类型。
实线边框：solid

p{
    font-size:30px;
    font-family:"Arial","隶书","微软雅黑","宋体";
    width:200px;
    height:200px;
    background-color:lightblue;
    border:5px solid red;
  }

2、认识CSS样式

CSS全称为“层叠样式表 (Cascading Style Sheets)”，它主要是用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等。

如下列代码：

p{
   font-size:12px;
   color:red;
   font-weight:bold;
}

使用CSS样式的一个好处是通过定义某个样式，可以让不同网页位置的文字有着统一的字体、字号或者颜色等。

3、CSS代码语法

css 样式由选择符和声明组成，而声明又由属性和值组成。

选择符：又称选择器，指明网页中要应用样式规则的元素。

声明：在英文大括号“｛｝”中的的就是声明，属性和值之间用英文冒号“：”分隔。当有多条声明时，中间可以英文分号“;”分隔，如下所示：

p{font-size:12px;color:red;}

注意：

1、最后一条声明可以没有分号，但是为了以后修改方便，一般也加上分号。
2、为了使用样式更加容易阅读，可以将每条代码写在一个新行内，如下所示：
p{
   font-size:12px;
   color:red;
}

4、CSS注释代码

就像在Html的注释一样，在CSS中也有注释语句：用/注释语句/来标明（Html中使用<!--注释语句-->)。就像下面代码：

/*设置段落默认格式*/
p{
   font-size:12px;
   color:red;
}