html,body {
	height:100%;
	width:100%;
}
body {
	margin:0;
	background:linear-gradient(124deg,#ff2400,#e81d1d,#e8b71d,#cdd115,#16d836,#15c8d1,#2b1de8,#dd00f3,#dd00f3);
	background-size:1800% 1800%;
	animation:rainbow 15s ease infinite;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	/*counter-reset:delay;
	*/
}
@keyframes rainbow {
	0% {
	background-position:0% 82%;
}
25% {
	background-position:50% 50%;
}
50% {
	background-position:100% 19%;
}
75% {
	background-position:100% 100%;
}
100% {
	background-position:0% 82%;
}
}p {
	font-size:30px;
	height:50px;
	line-height:50px;
	animation:slideup .6s cubic-bezier(0,0.9,0.1,1);
	margin:0;
	/*纯CSS方法失败*/
  /*counter-increment:delay;
	animation-delay:calc( 50ms * ( counter(delay) - 1) );
	*/
  animation-delay:calc( 50ms * var(--order) );
	animation-fill-mode:backwards;
	color:white;
}
@keyframes slideup {
	from {
	color:transparent;
	transform:translateY(50px);
}
to {
	color:white;
	transform:translateY(0);
}
}