文章 专题 AI工具 学习 下载 问答 源码 最近更新
PHP
会员中心 讲师中心 微信公众号
首页 > 微信小程序 > 小程序开发 > 正文

关于微信小程序中欢迎页面的制作

不言
发布： 2018-06-26 16:05:14
原创
4357人浏览过

这篇文章主要介绍了微信小程序 欢迎页面的制作含（源码下载）的相关资料,这里实现欢迎页面，开始做应用的时候都会用到，需要的朋友可以参考下

微信小程序欢迎页面：

先看下最后的效果图： 

首先打开开发工具，创建quick start项目，简单的修改一下。 

  • 把Index文件夹重命名为welcome；

  • 底部的hello world改为一个类似于按钮的样式；

  • 添加背景颜色； 修改顶部样式；

按钮的实现：

welcome.wxml

 <view class="usermotto">
 <text class="btn">开启小程序之旅</text>
 </view>
登录后复制

welcome.wxss

.usermotto {
 margin-top: 200px;
 border: 1px solid #405f80;
 width: 200rpx;
 height: 80rpx;
 text-align: center;
 border-radius: 5px;
}
.btn{
 font-size: 22rpx;
 font-family: MicroSoft Yahei;
 font-weight: bold;
 line-height: 80rpx;
}
登录后复制

背景颜色的设置：

注意：在最外部的view设置宽高百分百，添加背景颜色是无效的。因为微信默认外面还有一层page。 

所以需要这样写：

page{
 height: 100%;
 background: #b3d4db;
}
登录后复制

顶部设置：

app.jason

{
 "pages":[
 "pages/welcome/welcome"

 ],
 "window":{
 "backgroundTextStyle":"light",
 "navigationBarBackgroundColor": "#b3d4db",
 "navigationBarTitleText": "欢迎",
 "navigationBarTextStyle":"black"
 }
}
登录后复制

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！

相关推荐：

微信小程序实现实时圆形进度条的方法

微信小程序 监听手势滑动切换页面的实现

微信小程序开发之跑步微信小程序

以上就是关于微信小程序中欢迎页面的制作的详细内容，更多请关注php中文网其它相关文章！

微信app下载
微信app下载

微信是一款手机通信软件，支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊，还能根据地理位置找到附近的人，带给大家全新的移动沟通体验，有需要的小伙伴快来保存下载体验吧！

下载
相关标签：
php 微信小程序
来源：php中文网
收藏 点赞
上一篇：微信小程序新增的拖动组件movable-view的使用介绍 下一篇：关于微信小程序滚动视图容器的实现方法
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
微信小程序开发的主流方式是什么？ 微信小程序作为中国最受欢迎的移动应用之一，拥有庞大的用户群体。其开发方式多样且丰富，本文将深入探讨这些主流开发方式。微信官方开发工具微信官方提供了一种功能强大的开发工具，允许开发者在官方开发环境中构建小程序。这种方法通常使用小程序开发框架，如微信小程序官方提供的Miniprogram框架。开发者可以利用HTML、CSS和JavaScript等前端技术来创建小程序的界面和功能。优势：官方支持，稳定可靠。内置调试工具，方便开发和测试。社区庞大，提供大量资源和插件。开源框架除了微信官方工具外，还有许多
2025-06-13 09:40:34
684
如何选对小程序快速开发平台避坑指南‌ 当前市场对小程序的需求不断增加，各种快速开发平台如雨后春笋般涌现，为开发者提供了便捷的开发工具和服务。然而，面对众多开发平台，如何选择合适的平台并避免陷阱，成为了许多开发者关注的重点。本文将提供一份详细的避坑指南，帮助您在选择小程序快速开发平台时做出明智的选择。一、明确需求与目标在选择小程序快速开发平台之前，首先需要明确自己的需求和目标。了解您的目标用户群体、核心功能需求以及预期的市场效果，这将有助于您筛选出更适合需求的开发平台。避免盲目跟风，选择那些功能堆砌但不符合实际需求的平台。二、评估平台
2025-06-13 09:38:26
879
不懂设计,小程序界面怎么办? 对于许多企业而言，设计一款既美观又实用的微信小程序界面是一项挑战。如果你也面临着“缺乏设计技能，如何处理小程序界面？”的问题，不妨考虑以下几种解决方案。首先，你可以选择与专业的设计团队合作。市场上不乏专注于小程序界面设计的团队，他们具备丰富的设计经验和专业技能，能够根据你的需求和品牌形象，定制独特的小程序界面。虽然这种方法可能需要一定的投资，但专业设计通常能带来更好的用户体验和更高的转化率，使你的小程序在竞争中脱颖而出。其次，你可以利用现有的微信小程序模板进行快速搭建。许多开发平台提供了丰富的模
2025-06-13 09:32:02
475
知识付费小程序_怎么整合多种支付方式 在当今的数字时代，知识付费已经成为一种非常流行的学习方式。通过知识付费小程序，用户可以更加便捷地购买和学习课程，而开发者则可以通过提供高质量的内容来获取收益。然而，随着用户支付偏好的多样化，将多种支付方式整合到知识付费小程序中已成为开发的重点。一.多种支付方式的重要性不同的用户群体拥有不同的支付习惯，年轻人可能更倾向于使用微信支付或支付宝，而中老年用户则可能更习惯使用银联卡支付。为了满足这些多样的需求，知识付费小程序必须整合多种支付方式。这样不仅可以提升用户体验，还能提高支付成功率，从而提升小程
2025-06-13 09:24:12
285
H5小程序开发/连接品牌与用户的桥梁 亲爱的读者朋友们，今天我们要聊一聊一个既神秘又贴心的小家伙——H5小程序开发。就像那座连接品牌和用户之间的璀璨彩虹桥，它不仅美观实用，还能让人眼前一亮，使用户与品牌之间的距离瞬间拉近。你可能会问，H5小程序开发究竟是什么鬼？哎哟，别着急嘛，我来一点点揭开它的神秘面纱。H5小程序开发其实就是指利用HTML5等前沿技术开发出来的一种轻量级的应用。它不需要在应用商店下载，通过扫一扫或者点一点就能在手机上运行。可以说，它是那种“随叫随到，用完即走”的小巧玲珑的助手。为什么说H5小程序能成
2025-06-13 09:20:01
261
想要做一个小程序，什么项目比较合适呢？ 小程序已成为企业和个人开发的热门选择。小程序的优势在于无需下载和安装，使用便捷，开发成本低，适用于各种类型的应用程序。如果你也想开发一个小程序，但不知道该从哪些项目入手，以下是我为你提供的一些指导和建议。电商类电商类小程序因其提供的便捷购物体验而备受欢迎。你可以开发一个专注于特定商品的小程序，或是一个提供多种商品和服务的线上商城。旅游类旅游类小程序可以提供酒店预订、门票购买、旅游攻略等服务，为旅行者带来便利和帮助。社交类社交类小程序帮助用户找到志同道合的朋友，并进行交流和分享。你可以开发一个婚恋
2025-06-13 09:18:01
509
制作一个卖东西的小程序需要很多钱么？ 随着电子商务的快速发展，越来越多的商家和创业者倾向于通过移动平台建立自己的在线销售渠道。开发一个卖东西的小程序成为了许多人的选择，它能够提供便捷的购物体验和顺畅的交易流程。然而，关于制作一个卖东西的小程序的成本问题，并没有一个简单的答案，这取决于多个因素。以下是对这一问题的一些探讨。开发方式的选择：小程序的开发方式多样，包括自主开发、外包开发或使用在线平台。自主开发可能需要高昂的技术投入和开发成本，因为需要雇佣开发团队进行设计、编码和测试。外包给第三方开发公司虽然可以节省时间，但相应的开发费用也
2025-06-13 09:16:34
896
微信小程序开发需要很多钱么？ 随着微信小程序的崛起，许多人可能会对开发一款小程序的成本产生疑问。实际上，微信小程序的开发成本是因项目规模和需求而异的。本文将探讨影响微信小程序开发成本的因素，并提供如何进行费用预算的建议。首先，影响微信小程序开发成本的因素包括：1.功能和复杂性：小程序的功能越复杂，开发所需的时间和工作量就越大。如果你的小程序需要集成多种功能模块、实现复杂的交互和数据处理，那么开发成本可能较高。2.设计和用户界面：精美的设计和用户友好的界面设计是小程序成功的关键。如果你需要专业的设计团队来设计小程序的界面和用户
2025-06-13 09:14:21
814
团购小程序怎么开发？ 团购作为一种新兴的消费模式，因其高质量、低价格的特点而受到消费者的欢迎。随着互联网的发展，团购小程序成为了消费者购物的首选工具。本文将详细讲解如何开发一款团购小程序。一、明确产品定位在着手开发团购小程序前，首先要确定产品的定位。由于团购市场的多样性，需要根据自身的定位进行选择。可以专注于特定品类，如水果、蔬菜、肉类等，或者围绕某一社区提供服务。二、开发小程序开发小程序需要技术团队的支持。如果缺乏技术人才，可以选择外包或与专业团队合作。小程序的开发必须遵循微信小程序的开发规范，建议使用开源框架来避
2025-06-13 09:10:42
741
语音小程序app开发，让更多的人朗读你的广告 从增强现实（AR）到语音互动，各种新颖玩法不断涌现。微信小程序上线后，语音功能迅速走红。那么，语音APP软件究竟如何操作呢？（1）什么是语音？微信语音小程序是基于微信平台开发的一种语音互动工具。发起者可以设定特定的话语（口令），并附上一定的奖励，其他用户通过朗读该口令即可获得奖励。（2）如何创建语音？启动小程序后，设置好口令并生成语音链接。操作方式与微信的常规操作相似，但生成的语音链接可以分享到朋友圈和群聊中，朋友们需要按照文字口令进行语音朗读才能领取奖励。（3）为何微信语音小程序APP如此受欢
2025-06-13 09:02:29
309
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
app下载
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部