svg+css实现可编辑的文字切割效果代码

代码语言:html

所属分类:布局界面

代码描述:svg+css实现可编辑的文字切割效果代码

代码标签: svg css 编辑 文字 切割

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  

  
  
  
  
<style>
@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@1,900&display=swap");
html, body {
  display: grid;
}

html {
  min-height: 100%;
  background: #121212;
  /* pseudo needed because of no support yet for
   * filter(linear-gradient(#121212), url(#noisey)) */
}
html::before {
  /* stack it in the one HTML grid cell */
  grid-area: 1/1;
  background: #0001;
  /* add noise to backdrop underneath */
  backdrop-filter: url(#noisey);
  content: "";
}

/* stack it in the one HTML grid cell */
body {
  grid-area: 1/1;
}

/* svg element only used to hold filters, 
 * not.........完整代码请登录后点击上方下载按钮下载查看

网友评论0