You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

43 lines
1.0 KiB

<template>
<view class="background">
<!--按钮-->
<image class="button" @click="click" src="@/static/transition/page2/pictures/button.png"></image>
</view>
</template>
<script>
export default {
methods: {
click() {
uni.navigateTo({
url: '/pages/transition/page3/page3' // 跳转到 page3
});
}
}
}
</script>
<style lang="scss">
.background {
background-image: url("@/static/transition/page2/pictures/background.png");
background-size: cover;
background-position: center;
height: 100vh;
display: flex;
flex-direction: column; /* 纵向排列 */
align-items: center; /* 水平居中 */
justify-content: flex-end; /* 使内容向底部对齐 */
position: relative; /* 为绝对定位子元素提供相对定位的上下文 */
}
.button {
position: absolute; /* 绝对定位 */
width: 315px;
height: 60px;
bottom: 20%; /* 距离底部 20% 的位置 */
left: 50%; /* 水平居中 */
transform: translateX(-50%); /* 通过 translateX 使其居中 */
}
</style>