答案:主要就是css滤镜,你看一下下面的代码 <table border=1 style="border-style: solid; border-width: 1;font-size=12px" width="520"> <tr> <td width="510"> <span style="font-size:30pt;display:block; text-align:center;color:blue; filter:glow(color=red,strength=10);height:1">一路阳光1 </span></td> </tr> <tr> <td width="510"> <span style="font-size:30pt;display:block; text-align:center;color:darkblue; filter:blur(add=t,direction=135,strength=10);height:1">一路阳光2</span></td> </tr> <tr> <td width="510"> <div style="color:red;font-size:25pt;height:1;display:block; filter:progid:DXImageTransform.Microsoft.motionblur(strength=30,add=1,direction=135)"> <p align="center"> 一路阳光3</div></td> </tr> <tr> <td width="510"> <div style="height:1;width:100%; font-family:impact;font-size:30pt;color:navy;display:block; filter:progid:DXImageTransform.Microsoft.wave(Strength=3)"> <p align="center"> 一路阳光4</div></td> </tr> <tr> <td width="510"> <div style="height:1;width:100%; font-family:impact;font-size:30pt;color:navy;display:block; filter:progid:DXImageTransform.Microsoft.wave(Strength=3,freq=5)"> <p align="center"> 一路阳光5</div></td> </tr> <tr> <td width="510"> <span style="font-size:30pt;display:block; text-align:center;color:darkblue; filter:wave(add=t,freq=5,lightstrength=5,phase=0,strength=5); height:1">一路阳光6</span></td> </tr> <tr> <td width="510"> <span style="font-size:30pt;display:block; text-align:center;color:darkblue; filter:shadow(color=blue);height:1">一路阳光7</span></td> </tr> <tr> <td width="510"> <div align="center" style="height:1;font-size:30pt; filter:dropshadow(color=maroon,positive=1);">一路阳光8</div></td> </tr> <tr> <td width="510"> <div align="center" style="height:1;font-size:30pt; filter:dropshadow(color=maroon,positive=0);">一路阳光9</div></td> </tr> <tr> <td width="510"> <div style="filter:progid:DXImageTransform.Microsoft.engrave(bias=0.5); height:1;font-size:20pt;font-family:impact;background-color:blue"> <p align="center">SUNNY</div></td> </tr> <tr> <td width="510"> <div style="filter:progid:DXImageTransform.Microsoft.emboss(bias=0.5); height:1;font-family:impact;font-size:20pt;background-color:blue"> <p align="center">SUNNY</div></td> </tr> <tr> <td style="FILTER: mask(color=#E1E4EC)shadow(color=#8C96B5,direction=135)chroma(color=#E1E4EC)" align="center"><font color="blue" size="6"><b>一路阳光10</b></font></td> </tr> <tr> <td style="FILTER: alpha(opacity=100,finishiopacity=0,style=1)shadow(color=blue,direction=135)" align="center"><font color="blue" size="6"><b>一路阳光11</b></font></td> </tr> <tr> <td style="FILTER: mask(color=#E1E4EC)dropshadow(color=#B4BBCF,offx=-3,offy=-3,positive=1)chroma(color=#E1E4EC)" align="center"><font color="blue" size="6"><b>一路阳光12</b></font></td> </tr> <tr> <td style="FILTER: glow(color=#8C96B5,strength=2)shadow(color=#B4BBCF,direction=135)" align="center"><font color=#E1E4EC size=6><b>一路阳光13</b></font></td> </tr> <tr> <td style="FILTER: mask(color=#E1E4EC)shadow(color=#B4BBCF,direction=135)chroma(color=#E1E4EC)" align="center"><font color=#8C96B5 size=6><b>一路阳光14</b></font></td> </tr> <tr> <td style="FILTER: glow(strength=1)mask(color=#B4BBCF)chroma(color=#B4BBCF)" align="center" height=54><font color=#8C96B5 size=6><b>一路阳光15</b></font></td> </tr> <tr> <td><span style="position:absolute;font-size:30pt;color=blue;filter:fliph">一路阳光16</span></td> </tr> <tr> <td><span style="position:absolute;left:200;font-size:30pt;color=blue;filter:flipv">一路阳光17</span></td> </tr> </table> <table align=center background="http://www.idc2008.com/468X60-8.gif" border=0> <tr> <td style="FILTER: glow(strength=4)mask(color=#E1E4EC)"><font size="7"> <b>一路阳光18</b></font></td> </tr> </table> <style> div.bg{background:#ffc20e;width:50%} b{display:block;} /*将所有B标签转成块级元素*/ div b.topb b,div b.bottomb b{height:1px;overflow:hidden;background:#ffc20e;} /*div标签内类名为topb/bottomb的那个b标签的css属性值--高为1px,溢出部份隐藏,背景色同div.bg的背景色*/ div b.topb,div b.bottomb{background:white} /*div标签内类名为topb/bottomb的背景色要与body背景色一致*/ b.t1{margin:0 5px} /*标签margin值将决定溢出的多少值被隐藏*/ b.t2{margin:0 3px} b.t3{margin:0 2px} b.t4{margin:0 1px;height:2px;} </style> <div align="center"> <div class="bg"> <b class="topb"><!--**此b标签所包含的b标签要进行溢出隐藏**--> <b class="t1"></b> <b class="t2"></b> <b class="t3"></b> <b class="t4"></b> </b> <br> 年度总结:涉世未深,好吃懒做,眼高手低,胆小心粗,<br>爱慕虚荣,贪图富贵,眷恋美色,才疏学浅。 <br> <br> <b class="bottomb"> <b class="t4"></b> <b class="t3"></b> <b class="t2"></b> <b class="t1"></b> </b> </div> </div> .<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>runcode</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="Author" content="Sheneyan" /> <script type="text/javascript"> </script> <style type="text/css"> .xsnazzy h3{margin:0; padding:0 10px 5px 10px; border-bottom:1px solid #444;} .xsnazzy h3, .xsnazzy h3 a{font-size:1em;} .xsnazzy {background: transparent; width:530px; margin:10px 3px 0;} .xtop, .xbottom {display:block; background:transparent; font-size:1px;} .xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;} .xb1, .xb2, .xb3 {height:1px;} .xb2, .xb3, .xb4 {background:#fff; border-left:1px solid #444; border-right:1px solid #444;} .xb1 {margin:0 5px; background:#444;} .xb2 {margin:0 3px; border-width:0 2px;} .xb3 {margin:0 2px;} .xb4 {height:2px; margin:0 1px;} .xboxcontent {display:block; border:0 solid #444; border-width:0 1px; height:auto;} * html .xboxcontent {height:1px;} .color_a {background:#E2F3B8; color:#000;} </style> </head> <body> <div class="xsnazzy"> <b class="xtop"><b class="xb1"></b><b class="xb2 color_a"></b><b class="xb3 color_a"></b><b class="xb4 color_a"></b></b> <div class='xboxcontent'> <h3 class="color_a">这里是标题</h3> <p>这里是内容</p> </div> <b class="xbottom"><b class="xb4"></b><b class="xb3"></b><b class="xb2"></b><b class="xb1">
其他:晕。基本没多少人看得懂〔1-12岁〕
上一个:怎么用js给document添加一个鼠标单击事件
下一个:firebug如何根据一个客户端事件找到他所引用的js脚本