一、效果图
二、源代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>情人节爱心背景</title>
<style>
body{
overflow: hidden;
margin: 0;
}
h1{
position: fixed;
top: 40%;
left: 0;
width: 100%;
text-align: center;
transform:translateY(-50%);
font-family: 'Love Ya Like A Sister', cursive;
font-size: 40px;
color: #c70012;
padding: 0 20px;
}
@media (min-width:1200px){
h1{
font-size: 100px;
}
}
</style>
</head>
<body>
<canvas></canvas>
<h1>情人节快乐！</h1>
<script>
var canvas = document.querySelector("canvas"),
ctx = canvas.getContext("2d"