·
网页特效集锦
·
网页工具库
背景按钮
导航特效
图片特效
文本特效
时间特效
状态特效
另类特效
网页制作
网站首页
< 后退
|
收藏网页特效集锦
推荐网页特效
购物网站的导航效果,推荐!
向上下左右滚动图片的特效
超级变态广告代码
设为首页
加入收藏夹
防止选择和复制
新浪博客的提示窗口,推荐!
推荐网页工具
在线html编辑器
在线CSS编辑器
滚动条颜色生成器
弹出窗口生成器
网页加密解密工具
汉字转换成拼音工具
文本繁简体转换工具
您的位置:
网页特效集锦
>>
网页文本特效
>> 数字选中放大
查看此特效演示
数字选中放大
把如下代码复制到<head>与</head>之间
<style type="text/css"> ul#hovershow2{ list-style-type: none; margin: 50px; width:200px; float: left; display: inline; clear: both; } ul#hovershow2 li{ float: left; display: inline; width:20px; height: 20px; margin: 2px; } ul#hovershow2 li a { text-decoration: none; display: block; width:20px; height:20px; border:1px red solid; background-color: White; line-height: 20px; font-size: 12px; text-align: center; } ul#hovershow2 li a:hover{ position: absolute; width:40px; height: 40px; line-height: 40px; font-size: 32px; z-index:100; margin: -10px 0 0 -10px; } ul#hovershow2 li:hover + li a{ position: absolute; width:30px; height: 30px; line-height: 30px; font-size: 24px; z-index:99; margin: -5px 0 0 -5px; } </style>
把如下代码复制到<body>与</body>之间
<ul id="hovershow2"> <li><a href="#1" title="test"><span>1</span></a></li> <li><a href="#1" title="test"><span>2</span></a></li> <li><a href="#1" title="test"><span>3</span></a></li> <li><a href="#1" title="test"><span>4</span></a></li> <li><a href="#1" title="test"><span>5</span></a></li> <li><a href="#1" title="test"><span>6</span></a></li> <li><a href="#1" title="test"><span>7</span></a></li> </ul>
使用说明:鼠标移到数字上后数字会变大,<head></head>代码块中"ul#hovershow2 li a {}"大括号中的属性和值为数字默认的字号、数字的边框大小、边框颜色等,"ul#hovershow2 li a:hover{}"大括号中的属性和值为鼠标移到数字上后数字的字号、数字的边框大小、边框颜色等,这些都可以自行更改。<body></body>代码块中"href"的值为数字的链接,可以根据你的需要更改,如果不想加链接,使用默认的就可以了。
上一个特效:
网页文本打字效果
返回列表
下一个特效:
Cool!文字的光投影效果
关于我们
|
联系本站
|
免责声明
|
版权声明
|
网站地图
|
友情链接
|
域名注册
|
网站空间
Copyright © 2003~2008
www.xinnew.com
.All Rights Reserved.