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下硬件设备的使用与设置
最新文章
jQuery.fakeFile插件:网站上传控件
如何打开老版本数据库?
读取目录下的所有文件(包括子目录下
PHP 编码规范-编程惯例
将指定的asp文件内容生成HTML文件
iis PHP安装脚本 PHPInstall.vbs V3.1
视频转换大师WinMPG Video Convert 6.63
面向软件和 Web 开发人员的 Linux 发行
热门文章
让Vista响应更快
dos下at命令的用法
div+css打造可变高宽的圆角框
textarea是否自动换行
php下使用SimpleXML 处理XML 文件
Apache服务器配置全攻略(1）
使用ISAPI过滤器增强IIS的功能
跟我学LFS LiveUSB制作
CSS 嵌套DIV布局(position属性)
fc6下安装oracle手记
快速导航
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