飘零雾雨的专栏

欢迎到我的主博客:css探索之旅(http://blog.doyoe.com/)

一个有意思的字母逐渐增大效果

今天逛CSDN的时候,无意间看到挺有意思的字母逐渐增大的效果(个人觉得比较好玩)。整理了一下,拿给大家也看看。

记得以前只是用循环写过这样的效果,由于很少会用到,没去仔细研究过。今天偶然见到,还是觉得蛮好玩滴。

演示地址:http://www.doyoe.com/model/xhtmlcss/style/bigger.htm

代码如下:

 <!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" />
<meta name="Author" content="飘零雾雨|edzmaster@gmail.com" />
<title>字母逐渐增大</title>
<style type="text/css">
p {font-size:12px}
b {font-size:200%}
</style>
</head>
<body>
<p>I
<b>I<b>I<b>I<b>I</b></b></b></b>
</p>
</body>
</html>

这里的I会一个比一个大,dh20156说这有点像手机信号,我说太大了。

这个效果的原理非常简单,就是给标签b定义字体大小,然后通过层层嵌套以达到文字逐级增大。

 
阅读更多
文章标签: xhtml html 手机
个人分类: CSS
上一篇DIV布局之三行三列左右两栏固定中间自适应
下一篇AccessKey在web的作用性
想对作者说点什么? 我来说一句

div点击事件弹出层并逐渐消失

2014年08月09日 77KB 下载

没有更多推荐了,返回首页

关闭
关闭