}
</style>
</head>
<body>
<h1>分页样式</h1>
<div
class="page">
<a
href="#">1</a>
<a
href="#"class="selected">2</a>
<a
href="#">3</a> <a href="#">4</a> <a href="#">5</a>
<a href="#">6</a> <a href="#">7</a> <a href="#">8</a> <a href="#">9</a> <a
href="#">10</a> </div>
</body>
</html>
3：IE6 CSS 选择器区分 IE6
IE6 不支持子选择器；先针对 IE6 使用常规申明 CSS 选择器，然后再用子选择器针对 IE7+
及其他浏览器。
/*IE6 专用 */
.content {color:red;}
/* 其他浏览器 */
div>p .content {color:blue;}
4：IE6 最小高度
IE6 不支持 min-height 属性，但它却认为 height 就是最小高度。解决方法：
使用
ie6 不支持但其余浏览器支持的属性!important。
#container{min-height:200px; height:auto !important; height:200px;}
5：IE6100% 高度
在
IE6 下，如果要给元素定义 100%高度，必须要明确定义它的父级元素的高度，如果
你需要给元素定义满屏的高度，就得先给
html 和 body 定义 height:100%;。
6：IE6 躲猫猫 bug
在
IE6 和 IE7 下，躲猫猫 bug 是一个非常恼人的问题。一个撑破了容器的浮动元素，
如果在他之后有不浮动的内容，并且有一些定义了
:hover 的链接，当鼠标移到那些链接上
时，在
IE6 下就会触发躲猫猫。
解决方法很简单：
1.在（那个未浮动的）内容之后添加一个<span style="clear: both;"> </span>
2.触发包含了这些链接的容器的 hasLayout，一个简单的方法就是给其定义 height:1%;
7:IE6 绝对定位元素的 1 像素间距 bug
IE6 下的这个错误是由于进位处理误差造成（IE7 已修复），当绝对定位元素的父元素
高或宽为奇数时，
bottom 和 right 会产生错误。唯一的解决办法就是给父元素定义明确的高
宽值，但对于液态布局没有完美的解决方法。
8:IE 下 z-index 的 bug
在
IE 浏览器中，定位元素的 z-index 层级是相对于各自的父级容器，所以会导致 z-index