CSS实现div滑入效果

Vue3 + CSS实现div滑入

• animation 定义动画
• transform定义偏移
• opacity，设置清晰度，实现从无到有

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

.entity-btn {   position: absolute;   right: 0vw;   top: 4vh;   animation: fadenum 2s;   @keyframes fadenum {     0% {       transform: translateX(30vw);       opacity: 0;     }     100% {       transform: translateX(0);       opacity: 1;     }   }

 

按照上述设置，页面会被撑开，出现滚动条，在style设置滚动条不显示就可以

1 2 3 4 5

<style> ::-webkit-scrollbar {   display: none; } </style>