css的一些知识
1 <html> 2 <head> 3 <title>1</title> 4 <style type='text/css'> 5 #box{ 6 width:300px; 7 height:200px; 8 border:dashed 1px green; 9 line-height:30px; 10 letter-spacing:5px; 11 word-spacing:12px; 12 overflow:scroll;/*auto scroll visible(默认) hidden*/ 13 layout-flow:vertical-ideographic; 14 } 15 .spanone{ 16 color:green; 17 border:solid 1px red; 18 text-indent:20px; 19 } 20 #img0{ 21 filter:blur(add=true,direction=45,strength=15); 22 } 23 #img1{ 24 filter:blur(add=false,direction=45,strength=15); 25 } 26 #img2{ 27 filter:blur(add=true,direction=90,strength=15); 28 } 29 a.links:hover{ 30 color:green; 31 } 32 a.links:active{ 33 color:orange; 34 } 35 a.links:visited{ 36 color:#aaaaaa; 37 } 38 a.links:link{ 39 color:rgb(255,40,255); 40 } 41 </style> 42 </head> 43 <body> 44 <div id='box'> 45 <span class='spanone'>您好 世界 hello world hello world hello world hello world</span><br/><br/> 46 <span class='spanone'>hello world</span><br/><br/> 47 <span class='spanone'>hello world</span><br/><br/> 48 <span class='spanone'>hello world</span><br/><br/> 49 <span class='spanone'>hello world</span> 50 </div><br/> 51 <img src='img.jpg' title='森林' id='img0'/><br/> 52 <img src='img.jpg' title='森林' id='img1'/><br/> 53 <img src='img1.jpg' title='森林' id='img2' alt='森林'/> 54 <script language='javascript'> 55 var object=document.getElementById('img0'); 56 var x=60; 57 function fun(){ 58 object.style.filter="blur(add=true,direction="+x+",strength=15)"; 59 if(x==360){ 60 clearTimeout(out); 61 }else 62 x+=15; 63 } 64 var out=window.setInterval("fun();",100); 65 </script> 66 <a href='thename.html' class='links'>links</a> 67 </body> 68 </html>