我在CSS代码中遇到两个错误：“预期的RBRACE”，“意外的RBRACE”和“预期的LBRACE”

Question

我是CSS和HTML的新手，因为我在业余时间进行直播时正在学习它。 我正在尝试创建一个自定义文本动画，将文本切成两半，左半部分向上浮动，右半部分向下浮动（将来可能会更改为它们都摆动并向下倾斜的位置）。

我不确定在这一点上应该尝试什么，我以我能想到的所有方式添加，删除并弄乱了代码。我搜寻了互联网和这个论坛，但没有任何帮助。

#keyframes slideup {
    0% {
        top: 50%
    }        
    30% {
        top: 50%;
    }        
    90% {
        top 40%;
    }
    100%: {
        top: 40%;
}

我希望文本的左半部分向上浮动，而右侧则向下浮动，但这没有发生，由于我的代码，我假设它是

Answer 1

p{
position:absolute;
top:50%;
left:50%;
animation:slideup 1s infinite;
}
@keyframes slideup {
    0% {
        transform:translateY(0);
    }        
    100%{
      transform:translateY(-100px)
}
}

<p>text<p>

这就是您创建动画的方式！