svg+css实现发黄撕碎纸张背景效果代码

代码语言:html

所属分类:背景

代码描述:svg+css实现发黄撕碎纸张背景效果代码

代码标签: svg css 发黄 撕碎 纸张 背景

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

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

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


  
<style>
section {
	max-inline-size: 30em;
	min-inline-size: 200px;
	padding-inline: 3em;
	padding-block: 2em;
	margin-inline: 2em;
	position: relative;
}
section::after {
	content: " ";
	position: absolute;
	inset: 0;
	width: 100%;
	background: #fefced;
	box-shadow: 0 0 0 0.04em #fff, 0.2em 0.2em 0.8em -0.2em #3d3d3d,
		0 0 8em #f7e98e inset;
	filter: url(#torn);
	z-index: -1;
}

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
* + * {
	margin-block-start: 1cap;
}
body {
	min-height: 100vh;
	display: grid;
	place-items: center;
	background: #d6d6;
	font-family: system-ui, sans-serif;
	font-size:.........完整代码请登录后点击上方下载按钮下载查看

网友评论0