一个元素的堆叠顺序，不仅仅取决于它自身的z-index，更要看它所处在的堆栈上下文，如果所处的上下文的层级很低，即使他本身的z-index设置的很高，也无法实现你的要求。
z-index解析规则都是基于标准的符合w3c规范的浏览器，但IE系列的浏览器总是让你要多费一番功夫。
IE中z-index跟标准浏览器中的解析有一个小小的区别，那就是上面说的产生堆栈上下文中的三个条件中，对第二个条件的支持的区别，在标准浏览器中元素必须是有z-index值的同时要有position属性，且值不为static，满足这两个条件，才会产生一个新的堆栈上下文，但低版本的IE中就不管这么多了，只要你设置了position值不为static，他就会生成一个新的堆栈上下文。
列举不同的清除浮动的技巧，并指出它们各自适用的使用场景。
答案为可参考上题“解释下浮动和它的工作原理”
解释下 CSS sprites，以及你要如何在页面或网站中实现它。
CSS sprites其实就通过将多个图片融合到一副图里面，然后通过CSS的技术布局到页面上。这样做的好处是，减少图片数量，将会减少http的请求，提升网站性能。
1）在photoshop新建背景透明的画板，将小图片依次摆放在画板中，调整小图片为适当大小。
2）通过标尺记录图片的横坐标纵坐标。
3）编写css代码background:url(....) no-repeat x-offset y-offset;同时设定元素固定高度和宽度，overflow:hidden
你最喜欢的图片替换方法是什么，你如何选择使用。
不论是对浏览者还是对搜索引擎，文字都是最佳的页面内容展示方式，但是，由于字体等原因的限制，纯文字的展示渐渐无法满足爱美的设计师的要求。
于是，出��了通过CSS来实现用图片替换文字的方法，这种方式既能实现页面上各种丰富的效果，又能满足搜索引擎优化的需要。
Fahrner Image Replacement (FIR)
Phark 的方法
Gilder/Levin 的方法 (推荐)
Fahrner Image Replacement (FIR)
这是最早出现的图文替换技术，是由 Todd Fahrner 提出的，非常容易理解：
<h2><span>Hello World</span></h2>
h2 { background:url(hello_world.gif) no-repeat; width: 150px; height: 35px; } span { display: none; }
代码非常明白：先将图片应用在 H2 的背景中，然后将 SPAN 的标签隐藏。但是这种方式有个问题，就是当图片无法显示时，将导致这个区域没有任何内容。同时，使用 display:none 的方式隐藏的内容，将被许多主流屏幕阅读器忽略，从而造成可用性问题，因此，应该尽量避免使用。
Phark 的方法
<h2> Hello World </h2>h2 { text-indent: -5000px; background:url(hello_world.gif) no-repeat; width: 150px;height:35px; }
代码也非常简单，通过文本缩进，将文字隐藏，但是，当图片无法显示时，依然存在 FIR 的问题。
Gilder/Levin 的方法
<h2><span></span>Hello World </h2>h2 { width: 150px;height: 35px; position: relative; } h2 span { background: url(hello_world.gif) no-repeat; position: absolute; width: 100%; height: 100%; }
首先，将 H2 的 position 设为 relative ，这样将使 H2 里面的元素定位以 H2 为参照，然后将 SPAN 元素绝对定位，撑满整个 H2 区域，同时将背景图应用在 SPAN 标签里面；这种方法的原理是将 SPAN 标签覆盖在文字内容上面，一旦 SPAN 里面的背景图无法显示，将显示下层的文字内容，不影响正常使用。但是，此方法也有一个缺陷，就是背景图不能透明，否则将透出下面的文字。
讨论CSS hacks，条件引用或者其他。
hacks
_width针对于ie6。*width,+width针对于ie6,7。
color: red\9;/*IE8以及以下版本浏览器*/（但是测试可以兼容到ie10。
*+html与*html是IE特有的标签, firefox暂不支持.而*+html又为IE7特有标签（但是测试*html兼容ie6-10。*+兼容ie7-10）。
!important 在IE中会被忽视，ie6,7,8不识别，ie9+（包括ie9）是识别的。
条件引用