css布局实现跳舞的文本段落动画效果代码

代码语言:html

所属分类:动画

代码描述:css布局实现跳舞的文本段落动画效果代码

代码标签: 跳舞 文本 段落 动画 效果

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


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

<head>

  <meta charset="UTF-8">

  
  
  
<style>
body{
  margin:0;
  display:flex;
  justify-content:center;
  align-items:center;
  height:100vh;
}

.para-container{
  width:500px;
  height:500px;
  border:5px solid;
  border-radius:50%;
}

.para-container p{
  background-image:url('https://static.wikia.nocookie.net/f05bcfd2-cb01-4918-b55b-2398ade08213/scale-to-width/755');
  background-size:550px;
  background-repeat:no-repeat;
  background-position:center top;
  font-weight:bolder;
  font-family:helvetica;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
</style>

</head>

<body>
  <div class="para-container">
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Autem debitis reprehenderit totam eius adipisci consequuntur vitae odio quaerat repudiandae perspiciatis fugit magni at soluta accusantium beatae nesciunt accusamus laborum, inventore delectus maxime quis voluptatum. Odit, voluptatum voluptas accusantium perferendis beatae cum delectus officiis totam, eius officia sint itaque. Exercitationem dolorum numquam facere blanditiis distinctio, voluptatem et reprehenderit quam laudantium amet assumenda hic laboriosam maiores nam magni ipsum? Ipsam voluptate quis sunt officia sap.........完整代码请登录后点击上方下载按钮下载查看

网友评论0