phpStudy
phpStudy
网站首页
软件下载
PHP教程
编程技术
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
window
Linux
Mac
ASP
服务器
CMS
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
PostgreSQL
SQLite
教程手册
php
html
html5
css
css3
JavaScript
ajax
jquery
sql
ado
asp
aspnet
browsers
careers
dhtml
dotnetmobile
dtd
e4x
glossary
hosting
htmldom
json
media
msnet
quality
rdf
rss
schema
semweb
site
sitemap
smil
soap
svg
tags
tcpip
vbscript
w3c
wap
web
webservices
wmlscript
wsdl
xforms
xhtml
xlink
xml
xmldom
xpath
xquery
xsl
xslfo
php中文网
搜索
首页
JavaScript
CSS翻页效果,鼠标放上时变化,无需JS
CSS翻页效果,鼠标放上时变化,无需JS
<!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>DIV CSS实例：一款不错的CSS翻页效果（DIGG）</title> <style type="text/css"> BODY { FONT-SIZE: 12px;FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;WIDTH: 60%; PADDING-LEFT: 25px; } DIV.digg { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center } DIV.digg A { BORDER-RIGHT: #aaaadd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #aaaadd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #aaaadd 1px solid; COLOR: #000099; PADDING-TOP: 2px; BORDER-BOTTOM: #aaaadd 1px solid; TEXT-DECORATION: none } DIV.digg A:hover { BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 1px solid } DIV.digg A:active { BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 1px solid } DIV.digg SPAN.current { BORDER-RIGHT: #000099 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #000099 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #000099 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #000099 1px solid; BACKGROUND-COLOR: #000099 } DIV.digg SPAN.disabled { BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #eee 1px solid; COLOR: #ddd; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid } </style> <body> <p> <a href="/" _fcksavedurl="/">Digg Style - websbook.com</a> <div class="digg"> <span class="disabled"> < </span> <span class="current">1</span> <a href="#?page=2" _fcksavedurl="#?page=2">2</a> <a href="#?page=3" _fcksavedurl="#?page=3">3</a> <a href="#?page=4" _fcksavedurl="#?page=4">4</a> <a href="#?page=5" _fcksavedurl="#?page=5">5</a> <a href="#?page=6" _fcksavedurl="#?page=6">6</a> <a href="#?page=7" _fcksavedurl="#?page=7">7</a> ... <a href="#?page=199" _fcksavedurl="#?page=199">199</a> <a href="#?page=200" _fcksavedurl="#?page=200">200</a> <a href="#?page=2" _fcksavedurl="#?page=2"> > </a> </div> </p> </body> </html>
提示：您可以先修改部分代码再运行
相关阅读:
用js互相调用iframe页面内的js函数
Exchange 2000 Instant Messaging(组图)
FreeBSD为powerd设置cpu最小工作频率
Mysql LONGTEXT 类型存储大文件(二进制也可以) (修改+调试+整理)
Wordpress技巧:解决注册登录死循环问题
Exadel宣布AJAX在Studio Pro 3.5中支持JSF
jquery $.ajax入门应用一
改注册表用记事本关联未知类型文件
网页设计应该熟知的CSS 3.0技术
js下为表格内部动态添加行的代码
一个很简单的jquery+xml+ajax的无刷新树结构(无css，后台是c#)
部分软件在Ubuntu系统下的替代品
ASP.NET实例: GridView删除时弹出确认对话框
DOS下硬件设备的使用与设置
最新文章
Linux Samba服务器架设说明
MYSQL数据库最大连接数100怎么增大连接
手把手教你：企业服务器SQL Server弱口
用DOS命令判断磁盘分区是否为NTFS格式
SQLServer2005数据转换服务常见设计问题
在64位Linux下编译dtAgeiaPhysX
FreeBSD的基本系统下Shell设置
ASP.NET(VB) 给图片增加水印文字
热门文章
规规矩矩的Unix和意气风发Linux
Windows XP中的18个秘密武器
如何在linux环境下轻松搭建CVS服务器
Pear的介绍和安装
网站开发人员常去的10个网站
编写安全的扩展存储过程
防范非法用户入侵的“七招”
CSS Sprites 技术分析
php checkbox复选框值的获取与checkbox默认
Z-Blog文章列表区标签与特殊标签说明
快速导航
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
Linux
Mac
ASP
服务器
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
SQLite
wamp
交通频道
Copyright © 2016 phpStudy | 皖ICP备18014864号-4