div+css实现个人卡片垂直三点菜单悬浮伸缩效果代码

代码语言:html

所属分类:菜单导航

代码描述:div+css实现个人卡片垂直三点菜单悬浮伸缩效果代码

代码标签: div css 个人 卡片 垂直 三点 菜单 悬浮 伸缩 效果 代码

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >
<head>
 
<meta charset="UTF-8">

<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/all.6.4.0.css">
<style>
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
}
body {
        display: grid;
        place-items: center;
        min-height: 74vh;
        background: #88445d;
        overflow: hidden;
}
.list {
        display: flex;
        gap: 10px;
}
.list .user {
        position: relative;
        background: linear-gradient(to left, #cb948f, #88445d 28%, #48000b 75%);
        height: 150px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 20px;
        padding: 15px;
        gap: 20px;
        box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset,
                rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset,
                .........完整代码请登录后点击上方下载按钮下载查看

网友评论0