离子标题栏隐藏内容

时间:2016-10-07 19:58:29

标签: ionic-framework

我是Ionic的新手,当然在SO和谷歌上寻找解决方案,但没有成功。

我尝试使用以下代码构建第一个简单的应用程序:

<body>
        <ion-header-bar class="bar bar-header bar-dark">
          <h1 class="title">Settings</h1>
        </ion-header-bar>
        <ion-content class="has-header">
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </ion-content>
    </body>

标题重叠内容并隐藏第一行文字。

enter image description here

我做错了什么?

3 个答案:

答案 0 :(得分:0)

您需要将has-subheader类包含在ion-content指令中。

答案 1 :(得分:0)

这是他们每晚构建的codepen。这似乎更像是您正在运行的离子版本的问题。

<ion-header-bar>并且您提供的类是正确的,请尝试更新离子并查看是否可以修复它。

答案 2 :(得分:0)

使用<ion-view>代替<body>代码。

在那里你也可以设置标题,如:

<ion-view view-title="Settings">
<!-- Your content, etc goes here  -->
</ion-view>