H5App-美丽天气

本文介绍了使用HTML、CSS和HBuilder制作一个H5天气App的过程,包括预览效果、背景图片切换、沉浸式状态栏设置、数据请求及自定义$函数的使用,并提供了源码地址。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前段时间接触了mui,于是便做了一个H5天气app。

1.预览

已经用HBuilder打包成app在手机运行。
预览图
预览图

分别对应春夏秋冬。

2.背景的实现

背景的实现依靠了两个div,HTML如下:

<div class="weather-cover"></div>
<div class="weather-content"></div>

其中,cover是季节壁纸(准备了春夏秋冬四张),其CSS如下:

.weather-cover {
    width: 100vw;
    height: 100vh;

    background: center no-repeat;
    background-size: 100% 100%; 
    
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值