css分页样式代码

第一个是从360而来的效果如图所示:普通的a标记的分页，兼容性好。绿色样式
查看图片

演示代码:
共1678条评论12345...168下一页>>
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
第二种：深蓝色效果，当然颜色大家可以自行修改。
效果如图:
查看图片

演示代码:
css 分页样式2 首页上页 1 2 3 4 5 下页尾页第3页共8页
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
第三种代码:
css代码:


#page{margin:5px; padding-bottom:20px; padding-top:20px;} 
#page a{border:1px solid #003399;padding:5px;margin:2px;background-color:#FFFFFF;color:#003300;height:18px; } 
#page a:hover{font-size:14px; color:#FFFFFF; background-color:#003399;padding:5px;margin:2px;height:20px;}

效果图片.

这是mouse没的指上时.

这是指上去时,

好了现在我们来看看怎么使用这代码.

html代码:


<div id=page>记录条 共4页 每页20条 <a href=?id=74&page=1> 
<img src="/boke/blog/Pic/first.gif" border=0 alt='第一页'></a> 
<a href=?id=74&page=1 class='sf'>1</a> 
<a href=?id=74&page=2 class='sf'>2</a> 
<a href=?id=74&page=3 class='sf'>3</a> 
<a href=?id=74&page=4 class='sf'>4</a> 
<a href=?id=74&page=2><img src="/boke/blog/Pic/next.gif" border=0 alt='下一页' ></a> 
<a href=?id=74&page=4><img src="/boke/blog/Pic/Last.gif" alt='最后一页' border=0 ></a> 
</div>

用css filter做鼠标滑过图片效果
首先看个简单的例子吧。http://www.cssrain.cn[Ctrl+A全选注:如需引入外部Js需刷新才能执行]

使css兼容IE8的小技巧
这样就存在了新的问题，目前在IE7中工作正常的网页在IE8中会出现问题。微软在IE8提供三种解析页面的模式IE8StandardModes：默认的最标准的模式，严格按

有关于IE8 Beta 1两个提醒
IE5MAC的过滤器对IE8Beta1版同样有效IE8Beta1版不支持截字省略，也就是说不支持CSS3中的text-overflow:ellipsis;关于第一条可能对大家影响不大，不论怎么说MAC下