来看看：CSS元素的层叠与z-index设置

你用什么用的熟练就用什么，讲究的是效率，客户永远不管你用什么，页面就要好看，功能就要好用，还有时间和成本的问题。
　　我们在文章的更新中，出格注意对老手的指点，但poluoluo.com面临的是宽大的开辟职员，人人大概会碰到林林总总的成绩，有些成绩很不罕见，大概使用的很少，但我们仍然有需要进修更多的CSS结构常识与手艺，以应对大概呈现的庞大多变的CSS表里情势（挺汗）。明天这篇文章，次要先容了元素的层叠与z-index设置，但愿对您有所匡助，更多的常识，请多多参考poluoluo.com的教程。
声明
　　定位元素：position属性值设置除默许值static之外的元素，包含relative，absolute，fixed。
　　平台：win/IEwin/FF
z-index:
　　用来断定定位元素在垂直于显现屏偏向（以下称为Z轴）上的层叠按次

　　值：　　　auto|整数|inherit
　　默许：　　auto
　　合用于：　定位元素
　　承继性：　no
了解stackingcontext
　　每一个box都回属于一个stackingcontext,它是元素在z轴偏向上定位的参考。根元素构成rootstackingcontext，其他stackingcontext由定位元素设置z-index为非auto时发生。如#div1{position:relative;z-index:0;}便可使id=div1的元素发生stackingcontext。stackingcontext和containingblock并没有一定接洽。
了解stacklevel
　　在一个stackingcontext中的每一个box，都有一个stacklevel（即层叠级别，以下一致用stacklevel），它决意着在统一stackingcontext中每一个box在z轴上的显现按次。统一stackingcontext中，stacklevel值年夜的显现在上，stacklevel值小的显现鄙人，统一stacklevel的遵守后发先至的准绳（back-to-front）。分歧stackingcontext中，元素显现按次以父级的stackingcontext的stacklevel来决意显现的前后情形。于本身stacklevel有关。注重stacklevel和z-index并非一致观点。（将在后文渐渐了解）
stacklevel划定规矩
　　每一个stackingcontext中可包括块级（block）元素、内联（行内inline）元素，另有设置float属性的元素、定位元素等等他们在统一父级stackingcontext中的显现按次是如何的？即stacklevel是如何的呢？好比一个块级元素和内联元素产生层叠的话谁会在下面呢？是否是谁在前面谁就在下面呢？
　　依据w3c关于stacklevel的先容能够得出以下stacklevel划定规矩
　　每一个stackingcontext都包含以下stacklevel（后发先至）:

　　父级stackingcontext的背景、界限
　　z-index值为负值的定位元素（值越小越鄙人）
　　文本流中非定位的、block块级子元素
　　文本流中非定位的、float浮动子元素
　　似乎能发生stackingcontext的inline元素
　　不然，inline元素的stacklevel将在block元素之前。
　　z-index：auto/0的定位元素
　　z-index值为正的定位元素（值越年夜越在上）
以上stacklevel在扫瞄器实行情形：
　　firefox3.0下测试完整符合，firefox2.0下稍有分歧即：“z-index值为负值的定位元素”在“父级stackingcontext的背景、界限”之前。
　　ie6.0和7.0中：inline元素的stacklevel位于block元素之前，且“文本流中非定位的、float浮动子元素”（以下简称浮动元素）和“文本流中非定位的、block块级子元素”（以下简称block元素）处于统一级。
FF下测试
测试页面：　01.html（请分离在FF3.0和FF2.0中翻开）
代码申明：
　　由前所述，假如元素的stacklevel同级则后发先至；元素的stacklevel高，这不管代码在文档中地位怎样都显现在下面，即便代码在最后面；假如元素的stacklevel低，不管代码地位怎样都将显现鄙人面，即便代码在最初面。
　　我们就依据这一点，以“3.文本流中非定位的、block块级子元素”和“4.文本流中非定位的、float浮动子元素”为例，假如我把“float元素”的代码写在“block元素”的后面，且实践显现为：“float元素”在“block元素”之上。便可证实："float元素”的stacklevel级别较“block元素”高。由于假如同级,大概“block元素”的stacklevel高都应是“block元素”显现在上。
　　依据以上，依据尺度中的按次，把stacklevel高的元素代码写在后面，stacklevel低的代码写在前面，假如显现了局是：代码在后面的元素显现在上方，即证实下面的stacklevel划定规矩。
测试了局：
　　在FF3.0中了局和尺度按次分歧。FF2.0中“z-index值为负值的定位元素”在父级stackingcontext的背景上面。（注重ff2.0的这个特别性）
IE下测试
测试页面：　2.html(请在IE下扫瞄)
代码申明：
　　此代码也是依据下面的测试头脑，但因为inline元素在ie中的特别性，把inline的代码写在了前面，现实证实结论是准确的。关于“block元素”和“float元素”按次人人能够互换按次测试。
测试结论：
　　IE下（不管ie6.0大概ie7.0）“float元素”和“block元素”属统一stacklevel，而“inline元素”较其stacklevel低。
注释申明：
了　“float元素”，“z-index：auto的定位元素”似乎发生了新的stackingcontext，但其真正能发生新的stackingcontext的儿女任按其父级stackingcontext定位。（但IE中“z-index：auto的定位元素”
会具有z-index值0，发生一个新的stackingcontext，并影响其子元素定位。这是IE一个BUG）
inline元素在FF中似乎能发生新的stackingcontext，而在IE中则不克不及。
　　至此stacklevel划定规矩内容已终了，如今应当能了解stacklevel和z-index的分歧。stacklevel来决意这一个stackingcontext中各元素在z轴上的显现按次，关于统一stacklevel的定位元素才由z-index进一步决意显现序次。
一些成绩的注释
怿飞版主在《z-index在IE中的利诱》一文中最初提到的成绩：
演示地点：　3.html
以为：
解惑：IE扫瞄器仿佛给body元素默许了一个绝对定位属性（position:relative）。
真是如许吗？
演示地点：　4.html
剖析：
　　box1显现在body的下方，依据下面的stacklevel划定规矩，IE中，假如body默许了一个地位属性，即body是其父级stackingcontext，box1应显现在其上方，现实却不是如许。并且当我们给body加上position：relative今后，显现效果和stacklevel划定规矩分歧。以是body并没有默许地位属性。
　　那为何负值的定位元素在IE和FF下显现纷歧致呢？
　　ie中依据stacklevel划定规矩：z-index为负的定位元素的stacklevel比父级stackingcontext（此处是rootstackingcontext）高，显现在其上方。故box1在ie中能显现。ff3.0和尺度分歧，也能显现。人人能够试一下。
　　ff2.0中因为那条特别的stacklevel，即z-index为负的定位元素的stacklevel比父级stackingcontext（此处是rootstackingcontext）低，以是显现在rootstackingcontext下方。故不克不及瞥见。
　　别的，下面的代码中加上opacity那条后，在ff2.0中便可显现了。这又是甚么缘故原由呢？
　　推想：在火狐中假如给元素设置opacity属性（1除外），即会发生新的stackingcontext。
　　下面加上opacity属性后在ff2.0中可显现box1在body下，ff3.0box1在body上，（能够依据下面的stacklevel划定规矩本人剖析）切合推想。
在w3c的申明中也证实这点

InfuturelevelsofCSS,otherpropertiesmay
introducestackingcontexts,forexampleopacity
[CSS3COLOR].
总结：
　　在一个stackingcontext中元素的z-轴显现按次，由元素所处的stacklevel决意。关于统一stacklevel的定位元素由z-index的巨细进一步决意显现序次。
　　ie中给元素设置position属性（static除外）可发生新的stackingcontext
　　ff中给元素设置opacity属性（1除外）可发生新的stackingcontext
　　除此以外（大概设置其他属性也会发生新的stackingcontext，但还不晓得）只要定位元素设置了z-index(auto除外)才会发生新的stackingcontext，子元素将依照新的stackingcontext，定位。

Table中布局中，垃圾代码会很多，一些修饰的样式及布局的代码混合一起，很不利于直观。而Div更能体现样式和结构相分离，结构的重构性强。

只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweavermxXX很难理解。

滚动条)层属性--溢出(visible/hidden/scroll/auto)

Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。

在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。

以上大概就是文字图片的一些链接方法，通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识，他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能强大，使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。

运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。