用图片的方式制作引用块（Blockquote）效果

  CSS:

  
  

    
    

     
      
    
    

    
    

     
     <style type=
     
     "text/css"> 
    
    

    
    

     
      
    
    

    
    

     
     blockquote 
     
     { 
    
    

    
    
    
     
     background: 
     
     transparent 
     
     url
     
     (quoleft.gif
     
     ) 
     
     left 
     
     top 
     
     no-repeat; 
    
    

    
    

     
     } 
    
    

    
    

     
      
    
    

    
    

     
     blockquote div 
     
     { 
    
    

    
    
    
     
     padding: 
     
     0 40px; 
    
    

    
    
    
     
     background: 
     
     transparent 
     
     url
     
     (quoright.gif
     
     ) 
     
     right 
     
     bottom 
     
     no-repeat; 
    
    

    
    

     
     } 
    
    

    
    

     
      
    
    

    
    

     
     </style> 
    
    

    
    

     
       
    
    

HTML:

   
   

     
     

      
       
     
     

     
     

      
      <blockquote cite="http://www.CodeBit.cn"> 
     
     

     
     
    
      
      <div> 
     
     

     
     

      
          在编程的过程中，我们通常都会积累很多简单、有效并且可重用的小段代码，一个简单的字符串处理函数或者一个验证邮件地址的正则表达式，又或者一个简单的文件上传类，甚至一个效果不错的CSS导航样式。这些小技巧为我们节省了不少时间，但是时间一长，代码数量越来越多，寻找起来也耗费了不少时间。因此，本站致力于收集整理一些类似的小知识，并且努力提高文章搜索质量，一来方便大家查阅，二来也算是支持一下开源事业。 
     
     

     
     
    
      
      </div> 
     
     

     
     

      
      </blockquote>