原文

第一章 基础

层叠样式表(英文全称：Cascading Style Sheets)

一、什么是CSS

使用CSS给每一个单元格加上背景颜色，只需要在最前面加上CSS代码，所有的单元格就都有颜色了。

注：这是一种分层设计的思想，CSS把颜色、大小、位置等信息剥离到<style>中，而html只关心提供什么样的内容。

<style>

td{

  background-color:gray;

}

</style>

<table border="1">

  <tr >

      <td>1</td>

      <td>2</td>

  </tr>

  <tr>

      <td>3</td>

      <td>4</td>

  </tr>

  <tr>

      <td>a</td>

      <td>b</td>

  </tr>

</table>

二、语法

css的语法：

selector {property: value} 

即 选择器{属性:值} 

//学习css即学习有哪些选择器，哪些属性以及可以使用什么样的值

三、三种选择器（元素选择器、id选择器、类选择器）

1.元素选择器

2.id选择器

3.类选择器

第二章 CSS语法

1.设置元素的尺寸

---

2.设置背景

---

3.设置文本样式

---

4.设置字体样式

---

5.鼠标样式

运行实例一：鼠标移动到这段文字上，就看到鼠标样式变成了十字架

---

6.设置表格

①表格布局：

          属性:table-layout 

          automatic; 单元格的大小由td的内容宽度决定 

          fixed; 单元格的大小由td上设置的宽度决定 

          注：只对连续的英文字母起作用，如果使用中文就看不到效果

②表格边框

          属性：border-collapse

           值：

           separate:边框分隔

            collapse:边框合并

7.边框

8.内边框

元素内边框：指的是元素里的内容与边框之间的距离

9.外边框

元素的外边框：指的是元素边框和元素边框之间的距离

10.边框模型

11.超链状态

12.CCS文件和html文件分离

<link rel="stylesheet" type="text/css" href="first.css" />

第三章 布局

1.绝对定位：（属性：position；值：absolute）

通过指定left,top绝对定位一个元素

2.相对定位

3.浮动

属性：float

值：left、right                        

4.显示方式

元素的display显示方式有多种，隐藏、块级、内联、内联-块级

块级元素 内联元素

5.水平居中

align="center" 或者 style="text-align:center"

6.垂直居中

8.左右固定

9.贴在下方

bottom：0