html – 延迟的CSS内容

发布时间：2020-12-14 19:40:40 所属栏目：资源来源：网络整理

导读：我正在使用CSS内容属性在html标记之前添加内容. span::before { content: 'content that needs a delay';} span/span 有没有办法延迟内容的可见性(使用CSS)？解决方法 span::before { content: 'content that needs a delay'; margin-top: 25px; font-size:

我正在使用CSS内容属性在html标记之前添加内容.

span::before {
    content: 'content that needs a delay';
}

<span></span>

有没有办法延迟内容的可见性(使用CSS)？

解决方法

span::before {
    content: 'content that needs a delay';
     margin-top: 25px;
    font-size: 21px;
    text-align: center;
    animation: fadein 4s;
    -moz-animation: fadein 4s; /* Firefox */
    -webkit-animation: fadein 4s; /* Safari and Chrome */
    -o-animation: fadein 4s; /* Opera */

}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

<span></span>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!