绝对定位 固定定位 表格

1 绝对定位

绝对定位指使元素相对于html元素或离他最近 的祖先定位元素进行定位。
当将position属性设置为absolute时，则开启 了元素的绝对定位。
当开启了绝对定位以后，可以使用top、right、 bottom、left四个属性对元素进行定位。
绝对定位的特点：
绝对定位会使元素完全脱离文本流。
绝对定位的块元素的宽度会被其内容撑开。
绝对定位会使行内元素变成块元素。
一般使用绝对定位时会同时为其父元素指定一 个相对定位，以确保元素可以相对于父元素进 行定位。

2 固定定位

固定定位的元素会被锁定在屏幕的某个位置上，当 访问者滚动网页时，固定元素会在屏幕上保持不动。
当将position属性设置为fixed时，则开启了元素的 固定定位。
当开启了固定定位以后，可以使用top、right、
bottom、left四个属性对元素进行定位。
固定定位的其他特性和绝对定位类似。

z-index

当元素开启定位以后就可以设置z-index这 个属性。
这个属性可以提升定位元素所在的层级。
z-index可以指定一个整数作为参数，值越 大元素显示的优先级越高，也就是z-index 值较大的元素会显示在网页的最上层。

3 background-image

background-image可以为元素指定背景 图片。
和background-color类似，这不过这里使 用的是一个图片作为背景。
需要一个url地址作为参数，url地址需要指 向一个外部图片的路径
例如：

background-image: url(1.jpg)
1
4 background-repeat

background-repeat用于控制背景图片的 重复方式。
如果只设置背景图片默认背景图片将会使 用平铺的方式，可以通过该属性进行修改。
可选值：
repeat：默认值，图片左右上下平铺
no-repeat：只显示图片一次，不会平铺
repeat-x：沿x轴水平平铺一张图片
repeat-y：沿y轴水平平铺一张图片

5 background-position

background-position用来精确控制背景 图片在元素中的位置。
可以通过三种方式来确定图片在水平方向 和垂直方向的起点。
关键字：top right bottom left center
百分比
数值

6 background-attachment

background-attachment用来设置背景图 片是否随页面滚动。
可选值：
scroll：随页面滚动
fixed：不随页面滚动

7 background

background是背景的简写属性，通过这个 属性可以一次性设置多个样式，而且样式 的顺序没有要求。
例如：

background: green url(1.jpg) no-repeat center center fixed;
1
8 CSS Sprite

CSS Sprites是一种网页图片应用处理方式。
通过这种方式我们可以将网页中的零星图 片集中放到一张大图上。
这样一来，一次请求便可以同时加载多张 图片，大大提高了图片的加载效率

9 表格

在Web的历史中，HTML的表格发挥了极大的作用。最 初创建表格就是为了以表格的形式显示数据，后来表格 变成了一个极受欢迎的布局工具。
但是有了CSS以后，CSS在布局网页方面实际上会更出 色，所以现在我们使用表格的作用只有一个，就是用来 表示格式化的数据。
HTML中的表格可以很复杂，但是通常情况下我们不需 要创建过于复杂的表格。

table、tr、th、td

使用table标签创建一个表格。
tr表示表格中的一行。
tr中可以编写一个或多个th或td。
th表示表头。
td表示表格中的一个单元格。
1
2
3
4
5
caption、thead、tbody、tfoot

caption表示表格的标题。
thead表示表格的头部。
tbody表示表格的主体。
tfoot表示表格的底部。
1
2
3
4
10 合并单元格

合并单元格指将两个或两个以上的单元格 合并为一个单元格。
合并单元格可以通过在th或td中设置属性 来完成。

横向合并
colspan
纵向合并
rowspan
1
2
3
4