CSS的基本属性---表格样式
1、表格中<tr>表示行,<td>表示列,<th>表示列标题。
<table>标记有一些HTML属性可以设置表格的基本属性。比如：
cellspacing：列间距
cellpadding：列的内边距
border：表格边框
bgcolor：表格颜色
2、设置表格的边框
border-collapse
合并相邻列的边框线
border-spacing
设置列的间距
3、设置表格的宽度
CSS提供了两种确定表格以及内部单元格宽度的方式。一种与表格内部的内容相关，称为“自动方式”；一种与内容无关，称为“固定方式”；
table-layout
fixed：固定方式
auto：自动方式
4、表格的其他标记
table中还提供了很多标记来对内容进行分类，利用这些标记与CSS结合可以更好的控制表格的样式。
<thead>：表示表头
<tbody>：表示表内容
<tfoot>：表示表尾
5、在CSS中可以通过伪类:hover来设定当鼠标经过表格行时改变颜色。但是这种方法在IE6中会失效，因为IE6中的:hover只能在a标记中使用。如果要实现相同效果则需要借助Javascript。
6、表单元素也可以通过CSS来对其进行样式的设置。
制作像文字一样的按钮
1.使用transparent来设置背景透明
2.将border设置为0px
制作多彩下拉菜单
为option标记设置CSS样式
制作只有下划线的输入框
1.将border设置为0px
2.设置border-bottom
用CSS设置链接与导航菜单
1、在HTML中使用<a>标记来表示超链接。通过点击超链接后，跳转到不同的页面。
在CSS中还可以通过伪类来对超链接访问时的不同状态进行样式的设定。
a:link：未被访问过的超链接样式
a:visited：被点击过的超链接样式
a:hover：鼠标指针经过超链接时的样式
a:active：当点击时超链接的样式
2、创建按钮式超链接
很多网页上得超链接都制作成各种按钮效果，这些效果大都采用了各种图片。下面通过CSS的普通属性来模拟按钮的效果。
a:link,a:visited{
color:#A62020;
padding:4px 10px 4px 10px; /*文字位置*/
background-color: #ddd; /*背景颜色*/
text-decoration: none;
border-top: 1px solid #eee; /*边框实现阴影效果*/
border-left:1px solid #eee;
border-right:1px solid #717171;
border-bottom:1px solid #717171;
}
a:hover{
color:#821818;
padding:5px 8px 3px 12px;
background-color: #ccc;
border-top: 1px solid #717171; /*边框变换，实现“按下去”的效果*/
border-left:1px solid #717171;
border-right:1px solid #eee;
border-bottom:1px solid #eee;
}
4、控制鼠标指针
在浏览网页时，通常看到的鼠标指针的形状有箭头、手型和I字型，而在windows环境下实际看到的鼠标指针种类要比这个多得多。CSS弥补了HTML语言在这方面的不足，通过cursor属性可以设置各式各样的鼠标指针样式。
pointer：手型
body{
cursor:pointer;
}
5、传统的HTML语言提供了项目列表的基本功能，包括有序列表的<ol>标记和无序列表<ul>标记等。当引入CSS后，项目列表被赋予了很多新的属性，设置超越了它最初设计时的功能。下面介绍CSS对列表相关设置。
list-style-type：列表编号类型（具体值可参考CSS文档）
list-style-image：设定项目符号的图片样式。
6、简单的垂直排列菜单
当项目列表的list-style-type的属性值为”none”时，制作各式各样的菜单和导航条便成了项目列表的最大用处之一，通过各种CSS属性变幻可以达到很多意想不到的导航效果。
7、横向菜单
导航条不只有垂直排列的形式，很多时候还需要页面的菜单能够在水平方向显示。通过CSS属性的控制，可以轻松实现项目列表导航条的横竖转换。
实现横竖转换只需设置float:left即可，同时把宽度取消掉。
CSS盒子的浮动与定位
1、在标准流中，一个块级元素在水平方向会自动伸展，直到包含它的元素边界；而在垂直方向和兄弟元素依次排列，不能并排。使用浮动方式后，块级元素的表现会有所不同。
CSS中有一个float属性，默认为none，也就是标准流通常的情况。如果将float属性的值设置为left或right，元素就会向其父元素的左侧或右侧靠紧，同时默认情况下，盒子的宽度不再伸展，而是收缩，根据盒子里面内容的宽度确定。
2、使用clear清楚浮动的影响
clear属性除了可以设置为了left和right之外，还可以设置为both，表示同时清除左右两边的影响。
3、CSS提供了position这个属性，可以帮助设计者对标记进行定位，从而能够更好的完成网页的布局。position属性可以设置4个值：
static：默认值
relative：相对定位
absolute：绝对定位
fixed：固定定位
4、使用relative，即相对定位，除了将position属性设置为relative之外，还需指定一定的偏移量，水平方向通过left或者right属性来指定，垂直方向通过top和bottom来指定。
left、right、top、bottom这四个属性只有当position属性设置为absolute、relative或fixed时才有效。
使用相对定位的盒子，会相对于它原本的位置，通过偏移指定的距离，到达新的位置。
使用相对定位的盒子扔在标准流中，它对父亲和兄弟盒子没有任何影响。
5、使用绝对定位的盒子以它的“最近”的一个“已经定位”的“祖先元素”为基准进行偏移。如果没有已经定位的祖先元素，那么会以浏览器窗口为基准进行定位。
所谓“已经定位”元素的含义是，position属性被设置，并且被设置为不是static的任意一种方式，该元素被定义为“已经定位”的元素。
关于“祖先”元素，从任意节点开始，走到根节点，经过的所有节点都是它的祖先，其中直接上级节点是它的父亲，以此类推。
关于“最近”，在一个节点的所有祖先节点中，找出所有“已经定位”的元素，其中距离节点最近的一个节点，父亲比祖父近，以此类推，“最近”的就是要找的定位基准。
绝对定位的元素从标准流中脱离，这意味着他们对其后的兄弟盒子定位将有影响，就好像这个盒子被拿走了，其他排在后面的盒子将填补前面的位置。
6、position属性的第4个取值是fixed，即固定定位。它与绝对定位有些类似，区别在于定位的基准不是祖先元素，而是浏览器窗口或者其他显示设备的窗口。
7、z-index属性用于调整定位时重叠块的上下位置，与它的名称一样，想象页面为x-y轴，垂直于页面的方向为z轴，z-index值大的元素位于值小的上方。
z-index属性的值为整数，可以是正数也可以是负数。当块被设置了position属性时，该值便可设置各块之间的重叠高低关系。默认的z-index值为0，当两个块的z-index值一样时，将保持原有的高低覆盖关系。
8、前面介绍过display属性的block和inline两个值，一个代表块级显示，一个代表内嵌显示。display还有个值为none，当设置为none时，表示该元素将被隐藏。此隐藏表示该元素彻底从页面上消失。visibility：hidden表示隐藏，但不彻底消失。
3、
