马上就要情人节了,这段时间我会陆续出一些表白代码,绝对实用!
核心代码:
<html>
<head>
<meta charset="utf-8">
<title>爱在心中title>
<style>
body {
background: #000;
height: 100vh;
overflow: hidden;
}
#ui .love {
position: absolute;
top: 50%;
left: 50%;
margin: -225px 0 0 -225px;
}
#ui .love:last-child .love_word {
color: red;
font-size: 3.5rem;
text-shadow: 0 0 10px red;
}
#ui .love_word {
color: #fff;
font-size: 1.4rem;
transform: translateY(-100%) rotateZ(-30deg);
font-family: 'Dosis', sans-serif;
text-shadow: 0 0 10px #ffc800;
letter-spacing: 2px;
}
#ui .love_horizontal {
animation: horizontal 10000ms infinite alternate ease-in-out;
}
#ui .love_vertical {
animation: vertical 20000ms infinite linear;
}
#ui .love:nth-child(1) .love_horizontal {
animation-delay: -300ms;
}
77.5% {
transform: translateY(441.17647px);
}
79% {
transform: translateY(428.57143px);
}
100% {
transform: translateY(180px);
}
}
style>
head>
<body>
<div id="ui">
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">爱div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">biu~biu~div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">爱div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">lovediv>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">啵啵啵div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">爱div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">在一起div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">好吗div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">lovediv>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">小姐姐div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我喜欢你div>
div>
div>
div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">和我div>
div>
div>