onsen-ui 背景图片，如 http ://onsen. io/

Question

认为这将在网站上的某个地方，因为所有 3 个示例图像都是这样的:

也许它是用phonegap完成的？那里不用担心。

我尝试将 ons-navigator 和各种项目设置为透明、背景颜色等。

任何人都知道如何设置背景看起来像他们的例子？

我应该注意我使用的是轮播和列表，它不仅仅是一个普通页面，而且菜单、列表、轮播项目等都显示背景颜色。

Answer 1

该框架使用它自己的 css 规则逻辑来使某些事情起作用。

我最近才开始使用该框架，所以我没有所有答案，或者这是否是实现全屏背景图像的正确方法，但它适用于我的项目:)

JcDenton86 让我朝着正确的方向开始，谢谢。

<ons-page modifier="full_bg">
    ...
</ons-page>

向 添加背景规则的正确方法:

.page--full_bg__background {
    background: url('img/bg.jpg');
}

这只会将背景图像添加到页面元素，但导航栏位于页面元素的顶部，因此您必须添加样式以使其透明，然后您将能够在整个屏幕上看到背景。

.page-full_bg > .navigation-bar {
    background-color: transparent; 
}