简单的个人介绍网页-开场特效2（HTML+CSS）【附代码】

最新推荐文章于 2024-08-07 23:57:11 发布

Baridhu

最新推荐文章于 2024-08-07 23:57:11 发布

阅读量5.8k

点赞数 12

分类专栏：前端设计基础文章标签： html css css3

本文链接：https://blog.csdn.net/Baridhu/article/details/112800015

版权

这篇博客介绍了如何使用HTML和CSS来创建类似B站何同学的动态出场效果，提供相关代码供学习参考。

摘要由CSDN通过智能技术生成

动态效果

这是学习B站大佬何同学的出场动态效果
在这里插入图片描述

这是最终效果

代码

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HELLO!</title>
    <style>
        * {
   
            margin: 0;
            padding: 0;
        }

        a {
   
            text-decoration: none;
            color: white;
        }

        a:hover {
   
            color: white;
        }

        .container {
   
            position: relative;
            height: 100vh;
        }

        .item {
   
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0