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