css+定位
● 定位
○ position 定位属性，检索对象的定位方式；
■ static：默认值，无特殊定位，对象遵循HTML原则；
■ absolute：绝对定位，将对象从文档流中拖离出来，使用left/right/top/bottom等属性相对其最接近的一个并有定位设置的父元素进行绝对定位；如果不存在这样的父对象，则依据body对象，而其层叠通过z-index属性定义；
■ relative ：相对定位，对象不可层叠，相对自己原本的位置进行定位将依据right，top，left，bottom（相对定位）等属性在正常文档流中偏移位置；
■ fixed：(固定定位)ie6未支持，相对于浏览器窗口进行定位
○ 绝对定位和相对定位的区别
■ 参照物不同绝对定位的参照物是包含块，相对定位的参照物是元素本身位置；
■ 绝对定位将对象从文档流中脱离出来因此不占据空间，相对定位不破坏正常的文档流顺序无论是否进行移动，元素仍然占据原来的空间。
■ 固定定位不占据空间完全脱离文档流
○ 包含块的概念及作用
■ 包含块是绝对定位的基础，包含块就是为决定定位元素提供坐标，偏移和显示范围的参照物，即确定绝对定位的偏移起点和百分比 长度的参考；
默认状态下，body是一个大的包含块，所有绝对定位的元素都是根据窗口来定自己所处的位置和百分比大小的显示的，
如果我们定义了包含元素为包含元素块以后，对于被包含的绝对定位元素来说，就会根据最接近的具有定位功能的上级包含 元素来定位自己的显示位置。
■ 定义元素为包含块：给绝对定位元素的父元素添加声明position：relative；
○ 定位元素层叠属性：z-index : auto |
■ 检索或设置对象的层叠顺序。
■ auto：默认值。遵从其父对象
■ number:无单位的整数值。可为负数
○ 说明：
■ 较大 number 值的对象会覆盖在较小 number 值的对象之上。如两个绝对定位对象的此属性具有同样的number 值，那么将依据它们在HTML文档中声明的顺序层叠。
■ 此属性仅仅作用于 position 属性值为 relative 或 absolute 的对象。
■ 这个属性不会作用于窗口控件，如 select 对象。
● 命名锚点链接的应用
○ 定义：是网页制作 中超级链接的一种，又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接，运用相当普遍。
○ 命名锚点链接的应用：
■ 命名 锚点的作用：在同一页面内的不同位置进行跳转。
■ 给元素定义命名锚记名
语法：<标记 id="命名锚记名"> </标记>
■ 命名锚记连接
语法：<a href="#命名锚记名称"></a>
● 透明属性
○ opacity:value(ie除外其他浏览器，取值范围0到1)
○ filter:alpha(opacity=value);ie浏览器专用，取值范围0到100
● 扩展
○ 圆角切图
○ 纯css 书写
○ 切图拼接；
○ 插入flash
■ 语法：
<object width="value" height="value">
<param name="movie" value="flash路径及全称" />
<embed width="value" height="value" src="flash路径及全称"></embed>
</object>
■ 说明：flash源文件格式.fla,
■ 导出影片为.swf,
■ 创建播放器格式为.exe.
■ gif格式：.gif
■ 将flash背景设置为透明
■ <param name="wmode" value="transparent" />
■ 给<embed>标记添加属性：wmode="transparent"
■ IE中不显示flash,可做如下操作：
■ 下载安装flash player;
■ 打开IE浏览器，选择工具菜单--Internet选项----安全----低。
○ 滚动字幕的应用：
■ <marquee behavior（行为）="scroll(滚动)/alternate（晃动）"direction（方向）="up(从下向上)/down（从上向下）/left（从右向左）/right（从左向右）" scrollamount（滚动速度)="value"height="value(上下滚动范围)"width=""(左右滚动范围)onmouseover="stop()" （鼠标经过的时候停止滚动）onmouseout="start()"（鼠标离开时开始滚动）>内容</marquee>
○ 滚动条
■ Overflow内容溢出时的设置
属性：
■ overflow 水平及垂直方向内容溢出时的设置
■ overflow-x 水平方向内容溢出时的设置
■ overflow-y 垂直方向内容溢出时的设置
■ 以上三个属性设置的属性值：
● visible 默认值。使用该值时，无论设置的"width"和"height"的值是多少，其中的内容无论是否超出范围都将被强制显示。
● hidden 效果与visible相反。任何超出"width"和"height"的内容都会不可见。
● scroll 无论内容是否超越范围，都将显示滚动条。
● auto 当内容超出范围时，显示滚动条，否则不显示。
○ 自己定义滚动条的颜色
■ Body {
scrollbar-arrow-color: #f4ae21; /*图6,三角箭头的颜色*/
scrollbar-face-color: #333; /*图5,立体滚动条的颜色*/
scrollbar-3dlight-color: #666; /*图1,立体滚动条亮边的颜色*/
scrollbar-highlight-color: #666; /*图2,滚动条空白部分的颜色*/
scrollbar-shadow-color: #999; /*图3,立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: #666; /*图4,立体滚动条强阴影的颜色*/
scrollbar-track-color: #666; /*图7,立体滚动条背景颜色*/
scrollbar-base-color:#f8f8f8; /*滚动条的基本颜色*/
Cursor:url(mouse.cur); /*自定义个性鼠标*/
}
■ 以上适用与<body>、<div>、<textarea>、<iframe>
