virtual-love
/
index.html

<!DOCTYPE html>
<html>
<head>
    <title>Virtual Miss falls in love with me</title>
    <meta charset="UTF-8">
    <style type="text/css">
        body {
            background-color: black;
            color: white;
            font-family: monospace;
            font-size: 16px;
            padding: 20px;
        }

        h1 {
            font-size: 48px;
            text-align: center;
            margin-bottom: 50px;
        }
        h3{
            font-size: 25px;
            text-align: center;
            margin-bottom: 50px;
        }

        .container {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: center;
        }

        .card {
            width: 30%;
            background-color: #1c1c1c;
            border-radius: 10px;
            padding: 20px;
            margin-bottom: 20px;
        }

        .card img {
            max-width: 100%;
            height: auto;
            border-radius: 10px;
            margin-bottom: 10px;
            border-radius: 50%;
        }

        .card h2 {
            font-size: 24px;
            margin-bottom: 10px;
        }

        .card p {
            font-size: 18px;
            line-height: 1.5;
            margin-bottom: 20px;
        }
        iframe{
            float: left;
        }
        .text{
           position: relative;
            top: 10px;
            text-indent: 50px;
            float: left;
            font-size: 12px;
        }
        .text_2{
            text-indent: 50px;
            float: left;
            font-size: 12px;
        }
        #logo{
            position: relative;
            left: 700px;
            bottom: 150px;
            width: 50%;
            height: 50%;
        }
        /* 当鼠标悬停在发送按钮上时，使用 transform 属性实现缩放效果 */
        .go:hover {
            transform: scale(1.1);
            transition: transform 0.3s ease-out;
        }
    </style>
</head>
<body>
<h1>Virtual Miss falls in love with me</h1>
<h3>虚拟小姐爱上了我</h3>

<div class="container">
    <div class="card">
        <img src="userLond.png" alt="" class="go">
        <h2>珂朵莉</h2>
        <p>性格:温柔善良、热爱生命 特点:有着超高的歌唱和舞蹈能力、喜欢帮助别人</p >
    </div>

    <div class="card">
        <img src=userLond.png alt="Person Two" class="go">
        <h2>珊莎</h2>
        <p>性格:自信开朗、具有独特的个性魅力 特点:是个优秀的演说家,擅长在众人面前演讲和表现</p >
    </div>

    <div class="card">
        <img src="userLond.png" alt="Person Three" class="go">
        <h2>绫目</h2>
        <p>性格:冷静沉着、聪明机智 特点:是个智力超群的黑客,擅长破译密码和解决难题</p >
    </div>

    <div class="card">
        <img src="userLond.png" alt="Person Four" class="go">
        <h2>琉璃</h2>
        <p>性格:天真可爱、善良单纯 特点:是个萌妹子,喜欢画画和唱歌</p >
    </div>

    <div class="card">
        <img src="userLond.png" alt="Person Five" class="go">
        <h2>樱花</h2>
        <p>性格:神秘高傲、令人生畏 特点:是个有着极高影响力的虚拟偶像</p >
    </div>
    <div class="card">
        <img src="vesperaico.png" alt="Person Five" class="go">
        <h2>Vespera</h2>
        <p>vup培训公司 致力于配音虚拟偶像和vup(virtual Up),我们的目标是不断创新，打破现有艺人模式</p >
    </div>

    <div class="card">
        <img src="userLond.png" alt="Person Five" class="go">
        <h2>黑拓</h2>
        <p>从异世界穿越而来,来到这里是为了变成一只猫</p >
    </div>

    <div class="card">
        <img src="user.jpg" alt="Person Five" class="go">
        <h2>负一点五</h2>
        <p>一个梦想家，音乐家，哲学家</p>
    </div>


    <div class="card">
        <img src="userLond.png" alt="Person Five" class="go">
        <h2>-</h2>
        <p>-</p>
    </div>
</div>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="http://music.163.com/outchain/player?type=2&id=411314657&auto=1&height=66"></iframe>
<p class="text">免责条款：凡以任何方式登陆本网站或直接、间接使用本网站资料者，视为自愿接受本<a href="statement.html">网站声明</a>的约束。<br>
    <span class="text_2">邮箱:vup-vespera@foxmail.com   | 商业合作、建议或想法 欢迎投稿建议或者致信</span><br>
    <img  id="logo" src="LOGO_W.png" class="go">
</p>


<p></p>
</body>
</html>