视频技术

FFmpeg red5 nginx Html5 rtsp rtmp

·您当前的位置：首页 > 技术教程 > Html5技术 >

SVG用法：直接在HTML代码嵌入SVG代码

时间:2018-11-22 09:52阿酷
SVG用法：直接在HTML代码嵌入SVG代码

在Firefox、Internet Explorer9、谷歌Chrome和Safari中，你可以直接在HTML嵌入SVG代码。
 

  1. <!DOCTYPE html> 
  2. <html> 
  3. <body> 
  4.   
  5. <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
  6.    <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" /> 
  7. </svg> 
  8.   
  9. </body> 
  10. </html> 


SVG滤镜
注意： Internet Explorer和Safari不支持SVG滤镜！
 

  1. <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
  2.   <defs> 
  3.     <filter id="f1" x="0" y="0" width="200%" height="200%"> 
  4.       <feOffset result="offOut" in="SourceAlpha" dx="20" dy="20" /> 
  5.       <feGaussianBlur result="blurOut" in="offOut" stdDeviation="10" /> 
  6.       <feBlend in="SourceGraphic" in2="blurOut" mode="normal" /> 
  7.     </filter> 
  8.   </defs> 
  9.   <rect width="90" height="90" stroke="green" stroke-width="3" 
  10.   fill="yellow" filter="url(#f1)" /> 
  11. </svg> 


---------------------
作者：阿酷tony
来源：CSDN
原文：https://blog.csdn.net/ffffffff8/article/details/84334083

热门文章推荐

请稍候...

保利威视云平台-轻松实现点播直播视频应用

酷播云数据统计分析跨平台播放器