资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
CSS/HTML教程
>>>
css 分页效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> #page a{ display:block; border:1px solid red; background:black; color:white; width:20px; height:20px; float:left; margin-left:10px; text-align:center; text-decoration:none; font-size:12px; } #page a.current:link,#page a.current:visited{ background:white; color:black; } #page a.page_:link,#page a.page_:visited{ background:blue; width:50px; } </style> </head> <body> <div id="page"> <a href="#" _ewebeditor_ta_href="%23" class="page_">上一页</a> <a href="#" _ewebeditor_ta_href="%23">1</a> <a href="#" _ewebeditor_ta_href="%23" class="current">2</a> <a href="#" _ewebeditor_ta_href="%23">3</a> <a href="#" _ewebeditor_ta_href="%23">4</a> <a href="#" _ewebeditor_ta_href="%23">5</a> <a href="#" _ewebeditor_ta_href="%23">6</a> <a href="#" _ewebeditor_ta_href="%23">7</a> <a href="#" _ewebeditor_ta_href="%23">8</a> <a href="#" _ewebeditor_ta_href="%23">9</a> <a href="#" _ewebeditor_ta_href="%23">10</a> <a href="#" _ewebeditor_ta_href="%23" class="page_">下一页</a> </div> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程