惠青 發表於 2020-6-1 13:25:00

uni-app设置页面背景及背景图片

<h3 id="设置背景">设置背景</h3>
<pre><code>1、设置背景色:
&lt;template&gt;
    &lt;view class="container"&gt;//最外层
          &lt;view class="bg-set"&gt;&lt;/view&gt;//此标签为最外层view标签的第一个子标签
          &lt;view class="content"&gt;&lt;/view&gt;
    &lt;/view&gt;
&lt;/template&gt;

.bg-set{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #f4f4f4;
    z-index: -1;
}

2、设置背景图
&lt;template&gt;
    &lt;view class="container"&gt;
          &lt;image class="bg-set" src="https://img-1258.file.myqcloud.com/bg.png"&gt;&lt;/image&gt;
          &lt;view class="content"&gt;&lt;/view&gt;
    &lt;/view&gt;
&lt;/template&gt;

.bg-set{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
}
</code></pre>
<p>以上想法引自 https://www.cnblogs.com/swordLaughsHeaven/p/12118562.html 并略作修改</p>
<h3 id="官网方式">官网方式:</h3>
<pre><code>1、在 uni-app 中不能使用 * 选择器。
2、page 相当于 body 节点,例如
&lt;!-- 设置页面背景颜色 --&gt;
page {
background-color:#ccc;
}



或者在globalSTyle中配置: https://uniapp.dcloud.io/collocation/pages?id=style

个人没仔细研究,觉得局限还是有的
</code></pre><br><br>
来源:https://www.cnblogs.com/huihuihero/p/13024701.html
頁: [1]
查看完整版本: uni-app设置页面背景及背景图片