CSS的简单用法（上）

CSS的作用和发展

• 什么是CSS
  CSS 指层叠样式表 (Cascading Style Sheets)，是一种专门描述结构文档的表现方式的文档，包括字体大小、颜色、以及元素的精确定位等等。CSS可以让传统的web页面更具表现力。

• CSS相比传统的HTMLD的优势
  表达效果丰富
  文档体积小
  便于信息检索
  可读性好

  CSS的基本使用

  1、CSS的引入方式
  CSS可以控制HTML的表现形式，但在使用时必须先引入相应的CSS文件，引入的方式有以下4种：

• 使用内联样式：这种方式将样式内联定义到具体的HTML元素，通常用于精确控制一个HTML元素

• 使用内部样式定义：在HTML文档的head标签定义，一般一个CSS文档控制一份HTML文档
• 链接外部样式文件：将CSS文件和HTML文件彻底分离，一份CSS文档可以被多份HTML引用
• 导入外部样式文件：与第三种方式类似，使用@import导入外部样式文件
  各种引入方式的优先级：内联>内部样式>import>link
  2、CSS的基本语法
  CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。

selector {declaration1; declaration2; ... declarationN }

3、CSS样式
链接的四种状态：
a:link - 普通的、未被访问的链接
a:visited - 用户已访问的链接
a:hover - 鼠标指针位于链接的上方
a:active - 链接被点击的时刻
4、CSS框模型

element : 元素。
padding : 内边距，也有资料将其翻译为填充。
border : 边框。
margin : 外边距，也有资料将其翻译为空白或空白边。
5、CSS 定位
CSS 相对定位
相对定位是一个非常容易掌握的概念。如果对一个元素进行相对定位，它将出现在它所在的位置上。然后，可以通过设置垂直或水平位置，让这个元素“相对于”它的起点进行移动。
CSS 绝对定位
绝对定位使元素的位置与文档流无关，因此不占据空间。这一点与相对定位不同，相对定位实际上被看作普通流定位模型的一部分，因为元素的位置相对于它在普通流中的位置。
浮动
浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。
详细内容参考以下网站。