![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/d17c62d071da1831ae8b14acad65b983.png)
<div class="separate-panel">
<div class="about">
<router-link :to="{name: 'giud'}">开始使用</router-link>
</div>
</div>
.separate-panel{
position: relative;
.about{
position: absolute;
width: 100%;
height: 200px;
top: 20px;
z-index: 9;
background: #fff;
text-align: center;
a {
color: #fff;
background-image: linear-gradient(90deg, #00AEFF 0%, #3369E7 100%);
box-shadow: 0 2px 6px 0 rgba(51,105,231,0.4);
display: inline-block;
width: 190px;
height: 56px;
margin: 0 35px;
font-size: 18px;
line-height: 56px;
border-radius: 28px;
transition: all .3s;
cursor: pointer;
}
.btn-github{
color: #316DE9;
border: 1px solid #2F6EE9;
background: #fff;
box-shadow: none;
}
}
}
.separate-panel:after{
content: '';
display: block;
position: absolute;
top: -80px;
width: 100%;
height: 250px;
background: #fff;
box-shadow: 0 -4px 30px 0 #DFE1E6;
transform: skewY(-4deg);
}