typed实现编辑器打字动画效果代码

代码语言:html

所属分类:动画

代码描述:typed实现编辑器打字动画效果代码

代码标签: 打字 动画 效果

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

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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    .h1 {
        margin: 10px 0 20px;
        font-size: 2.5em;
        text-align: center;
        color: #fff;
        text-shadow: #000 0px 2px 4px;
    }
    .text-editor-wrap {
        display: block;
        margin: auto;
        max-width: 530px;
        border-radius: 10px;
        box-shadow: rgb(0 0 0 / 80%) 0px 20px 70px;
        clear: both;
        overflow: hidden;
        -webkit-transition: all 0.5s ease-out;
        -moz-transition: all 0.5s ease-out;
        -ms-transition: all 0.5s ease-out;
        -o-transition: all 0.5s ease-out;
        transition: all 0.5s ease-out;
    }
    .title-bar {
        padding: 5px 0;
        font-family: "Lucida Grande", sans-serif;
        font-size: 0.75em;
        text-align: center;
        text-shadow: rgb(255 255 255 / 80%) 0px 1px 0px;
        background-color: #f8f8f8;
        background-image: -webkit-linear-gradient(top, #e8e8.........完整代码请登录后点击上方下载按钮下载查看

网友评论0