css实现鼠标悬浮文字菜单依次翻滚动画效果代码-html代码-BFW代码库

css实现鼠标悬浮文字菜单依次翻滚动画效果代码

代码语言：html

代码描述：css实现鼠标悬浮文字菜单依次翻滚动画效果代码

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

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

<head>
  <meta charset="UTF-8">
  
  
  
<style>
@import url(https://fonts.bunny.net/css?family=bayon:400);
@layer base, demo;

@layer demo {
	body{
		font-family: 'Bayon', sans-serif;
	}
	.word {
		--translate-distance: -1lh;
		--trans-duration: 3000ms;
		--trans-delay-factor: 20ms;
		--trans-timimg-function: linear(0, 0.011 0.6%, 0.041 1.2%, 0.173 2.6%, 0.894 7.4%, 1.128 9.3%, 1.271 11.1%, 1.311 12%, 1.333 13%, 1.328 14.4%, 1.286 15.9%, 1.031 21%, 0.95 23%, 0.907 24.7%, 0.888 26.5%, 0.89 27.9%, 0.904 29.4%, 1.034 42.5%, 0.997 49.3%, 0.987 53.3%, 1.004 66.5%, 1);
		--text-color-hover: rgb(0 132 209);
		
		
		margin: 0;
		font-size: 4rem;
		font-weight: 700;
		line-height: 1;
		di.........完整代码请登录后点击上方下载按钮下载查看