提交 268560aa authored 作者: matian's avatar matian

chore:marywood营销页面添加按钮

上级 2c0b5b1e
<template>
<div class="main_content">
<a href="https://marywood-plus.ezijing.com" target="_blank">
<img src="https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner1.png" alt="" />
</a>
<a href="https://marywood.ezijing.com" target="_blank">
<img src="https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner2.png" alt=""/>
</a>
<div class="main_content ">
<div class="container_item banner1">
<a href="https://marywood-plus.ezijing.com" target="_blank">
<div class="btn_detail">查看详情</div>
</a>
</div>
<div class="container_item banner2">
<a href="https://marywood.ezijing.com" target="_blank">
<div class="btn_detail">查看详情</div>
</a>
</div>
</div>
</template>
<script>
export default {}
</script>
<script>
export default {}
</script>
<style scoped>
.main_content{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
img{
<style lang="scss" scoped>
.main_content {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.container_item {
width: 2.75rem;
height: 2.75rem;
margin-top: .37rem;
}</style>
</template>
margin-top: 0.42rem;
position: relative;
.btn_detail {
width: 0.87rem;
height: 0.25rem;
border: 1px solid #ffffff;
line-height: 0.25rem;
text-align: center;
font-size: 0.15rem;
font-weight: 500;
color: #ffffff;
position: absolute;
top: 2.15rem;
left: 50%;
transform: translateX(-50%);
cursor: pointer;
}
// .btn_detail:hover {
// background: #ffffff;
// color: #333333;
// }
}
.banner1 {
background: url(https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner1.png) no-repeat;
background-size: 100% 100%;
}
.banner2 {
background: url(https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner2.png);
background-size: contain;
}
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论