svg+css模拟真实木头背景效果代码
代码语言:html
所属分类:背景
代码描述:svg+css模拟真实木头背景效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> body{margin:0 auto;} svg{position:absolute;} </style> </head> <body> <svg xmlns="http://www.w3.org/2000/svg" height="100%" width="100%"> <defs> <pattern id="planks" width="100%" height="20%" patternUnits="userSpaceOnUse"> <rect width="100%" height="1.7"></rect> </pattern> <filter id="grain2"> <feTurbulence baseFrequency="0.0025 0.05" numOctaves="1" /> <feColorMatrix values="4.2 1.8 0.3 -4.9 2.4 -1 0.8 3.9 2.4 4.7 2.2 0.2 -3.9 4.6 1.2 1.7 -3.7 -3 -4.9 0.6" /> </filter> <filter id="cuts"> <feTurbulence baseFrequency="0.0009 0.003" numOctaves="10" /> <feColorMatrix values="1.6 2.6 3.4 1 5 1.5 4.8 2.1 3.3 5 1.6 3.1 4.1 0.6 3.7 2.8 4.8 0.6 2.3 -3.4" /> </filter> <filter id="grain"> <feTurbulence baseFrequency="0.005 0.09" numOctaves="2.........完整代码请登录后点击上方下载按钮下载查看
网友评论0