CSS

1、CSS的基本介绍：
  CSS：其实就是为了修饰美化HTML元素的。也就是 HTML是名词， CSS是形容词。CSS的存在很大程度可以让HTML代码实现低耦合，复用性极高。

  CSS：属性:值。如：style="color:red"。
  CSS有三大种实现形式：
  1、内嵌形式。style="color:red"
  2、文件头部。<style>....</style>
  3、文件外部。<....xxx.css>

2、CSS的三大选择器
  1、元素选择器 根据某个HTML元素标签，来批量设置。如：div{}
  2、ID选择器 根据元素属性id的值来设置。注意：ID在CSS中是唯一的。如：#testDiv{}
  3、类选择器 根据元素属性class的值来设置。如：.testDiv{}

3、CSS的颜色表达方式
  1、英文字母 yellow blue red
  2、十六进制 如: #FFFFFF 白色 #000000 黑色
  3、RGB。 如: rgb(255,255,255).

4、关于背景的设置
  背景：background
  background : background-color || background-image || background-repeat ||   background-attachment || background-position

  background: #fff url("img/bd.png")

  1、color 背景颜色
  2、image 背景图片
  3、repeat 是否重复显示，repeat-x / repeat-y
  4、position 所在位置
  5、attachment 背景图片是否随滚动而滚动
  background-position : length || length
  background-position : position || position
  参数：
  length : 　百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位
  position : 　top | center | bottom | left | center | right
  background-attachment : scroll | fixed
  参数：
  scroll : 　背景图像是随对象内容滚动
  fixed : 　背景图像固定

5、CSS的其他设置
   文字格式: text
  text-align: 文字 居中，靠右，默认靠左。
  text-decoration: none 表示去掉下划线。一般用于a标签
  text-indent: 1%; 文字缩进，百分比是根据设置的标签的宽度决定。
  文字：font
  font : font-style || font-variant || font-weight || font-size || line-height || font-family
  font-style: 字体格式。
  font-variant： 大小写字母
  font-weight: 字体是否加粗
  font-size: 字体大小
  line-height: 行高
  font-family:字体
  超链接: a
  a:link{ } 普通链接样式
  a:hover{} 鼠标悬停样式
  a:visited{} 成功访问后的样式
  a:active{} 链接被点击的那一刻
  cursor: pointer; 鼠标手势，一般用于有点击事件的情况下加入。
  列表: list
  list-style: list-style-image || list-style-position || list-style-type
  list-style-image: 图片。
  list-style-type: 图形类型。
  list-style-position: 图形位置
  边框：border 注意：批量设置四个边，顺序为上右下左，顺时针。
  border-color: 批量设置颜色
  border-top/bottom/left/right-color: 设置单边颜色
  border-radius: 批量设置边框圆角
  border-top-right-radius: 设置右上的圆角
  border-style: 批量设置边框样式。一般用 solid 实线。
  border-width: 批量设置边框宽度。
  border: border-width || border-style || border-color
6、盒子模型
  盒子模型：每个控件都是一个盒子模型
  盒子模型包括：外边距、边框、内边距，以及物体本身的尺寸。
  外边距是指控件与控件之间的距离。注意：是相邻的控件距离。
  内边距是指子控件以父控件的左上角原点为轴心点的距离。
  outline 轮廓 位于控件最外层
  outline: 宽度 颜色 轮廓类型
  outline-style: solid;
  ouline-color: black;
  outline-width: 1px;
  float: 浮动。一般使控件集体向左移 或者 向右移。
  一般操作对象就是图片。
  float浮动常用于布局。
  clear:both 用于清除浮动。
尺寸：
  1、line-height 行高
  2、max-height 最大的高度
  3、min-height 最小的高度
  4、max-width 最大的宽度
  5、min-width 最小的宽度
  em px(像素单位) pt
position： 定位
  1、relative 相对定位，是指相对于临近的元素的定位。
  2、absolute 绝对定位，是指邻近父元素的定位，如果没有那就是body定位，注意：如果子控件定义了绝对，那么父控件应该定义绝对
   absolute 找的就是已经定位过的父元素，如果没有，那么就去找body.

3、fixed 不会随着窗口的滚动而滚动

static : 　无特殊定位，对象遵循HTML定位规则
absolute : 　将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位。而其层叠通过z-index属性定义。此时对象不具有边距，但仍有补白和边框
relative : 　对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置
fixed : 　IE5.5及NS6尚不支持此属性

z-index: auto | number
参数：
  auto : 　遵从其父对象的定位
  number : 　无单位的整数值。可为负数

  设置边框无边距。
  body{
  margin: 0px;
  padding: 0px;
}

7、伪类
  伪类：其实就是产生特殊效果，行为的类。
:link
:visited
:focus
:active
:hover
....

overflow： hidden 该句话产生的特效就是超过范围以后，隐藏
display: none; 隐藏该控件
display: block; 针对于块元素的默认值,如果block作用于内联元素上，是会添加新行的。
display: inline 针对于内联元素的默认值，如果inline作用于块元素上，只会显示内容部分区域。


visibility：
inherit : 　继承上一个父对象的可见性
visible : 　对象可视
hidden : 　对象隐藏
collapse : 　主要用来隐藏表格的行或列。隐藏的行或列能够被其他内容使用。对于表格外的其他对象，其作用等同于hidden。IE5.5尚不支持此属性。
说明：
设置或检索是否显示对象。与display属性不同，此属性为隐藏的对象保留其占据的物理空间。
如果希望对象为可视，其父对象也必须是可视的。
对应的脚本特性为visibility。请参阅我编写的其他书目。