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下硬件设备的使用与设置
最新文章
使ASP程序跨浏览器
AJAX集天气\IP\多国语言翻译MP3(可同步LR
在Linux系统下如何增加一个新的系统用
javascript 7行代码画出一个围棋棋盘
jquery中的mouseleave和mouseout的区别 模仿
AppSettings属性检索ASP.NET配置信息
基于JQuery的访问WebService的代码（可访
sql标签嵌套调用实现循环显示栏目文
热门文章
zlib_get_coding_type Returns the coding type use
zip_read Read next entry in a ZIP file archive
zip_open Open a ZIP file archive
zip_entry_read Read from an open directory entry
zip_entry_open Open a directory entry for readin
zip_entry_name Retrieve the name of a directory
zip_entry_filesize Retrieve the actual file size
zip_entry_compressionmethod Retrieve the compres
zip_entry_compressedsize Retrieve the compressed
zip_entry_close Close a directory entry
快速导航
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