vuetify - 显示主页和页脚之间的背景

时间:2017-10-31 20:59:48

标签: vuejs2 vuetify.js

我有一个vuetify项目。在任何使用iOS 10.whatever的iphone上,我的主要部分和页脚之间只有显示背景的间隙。

我已经完成了我能想到的一切,而且这一点可能是我很容易忽视的东西,但似乎v-content并没有占据整个主要部分。有人遇到过这个问题吗?

<template>
<v-app style="background-color: rgba(238,232,205,1);">
    <app-age-verification></app-age-verification>
    <main>
        <v-content>
            <transition name="fade" mode="out-in">
                <router-view>
                    <v-container fluid></v-container>
                </router-view>
            </transition>
        </v-content>
    </main>
  <app-footer app></app-footer>
</v-app>
</template>

组件示例:

<template>
<section id="main">
    <v-container grid-list-xl>
        <v-layout row wrap>
            <v-flex xs6 sm4>
                <img :src="home.logo">
                <br><br>
                <v-layout justify-center wrap>
                  <v-btn style="background-color: #661e26; 
                               color: #eee8cd"
                           large
                           @click="auth">
                        {{ b1 }}
                    </v-btn>
                    <v-btn style="background-color: #661e26; 
                                  color: #eee8cd"
                           large
                           @click="navigateToCustomer">
                        {{ b2 }}
                    </v-btn>
                </v-layout>
            </v-flex>
        </v-layout>
    </v-container>
</section>
</template>

谢谢

1 个答案:

答案 0 :(得分:0)

我会尝试删除<main>标记。我的一个布局遇到了类似的问题。

<template>
 <v-app style="background-color: rgba(238,232,205,1);">
  <app-age-verification></app-age-verification>
    <v-content>
        <transition name="fade" mode="out-in">
            <router-view>
                <v-container fluid></v-container>
            </router-view>
        </transition>
    </v-content>
  <app-footer app></app-footer>
 </v-app>
</template>

<main>标签很快就会被弃用,这里是github issue。虽然它似乎在0.17.x发布之前影响了一些东西。