splitting实现文字彩色悬浮放大效果代码

代码语言:html

所属分类:悬停

代码描述:splitting实现文字彩色悬浮放大效果代码

代码标签: 彩色 悬浮 放大 效果

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

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

<head>

    <meta charset="UTF-8">


    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css">
    <link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=Cabin+Condensed:wght@700&amp;display=swap'>
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/splitting.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/splitting-cells.css">

    <style>
@import url("https://p.typekit.net/p.css?s=1&k=zlj2zcu&ht=tk&f=27707&a=19392654&app=typekit&e=css");

@font-face {
        font-family:"acier-bat-gris";
        src:url("https://use.typekit.net/af/b2b981/00000000000000007735dfaf/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/b2b981/00000000000000007735dfaf/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/b2b981/00000000000000007735dfaf/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
        font-display:auto;font-style:normal;font-weight:400;
    }

        .tk-acier-bat-gris {
            font-family: "acier-bat-gris",sans-serif;
        }
:root {
            --fluid-type-min: 2rem;
            --fluid-type-max: 10rem;
            --fluid-type-target: 5vw;
            --color: #dbe3ea;
        }

        body {
            background: #24313c;
            color: var(--color);
            padding: 2rem;
            font-family: "Cabin Condensed", sans-serif;
            text-transform: uppercase;
            font-weight: bold;
            display: grid;
            place-items: cente.........完整代码请登录后点击上方下载按钮下载查看

网友评论0