柴门鸟雀噪,归客千里至。光明顶下来,一路听着阵阵松涛,我们走过西海,飞来石,天海,爬过百步云梯,伴着凤凰松迎客松的多姿到了玉屏峰。玉屏峰犹如一道屏障,山面光滑如镜子,如屏风,还不时有几个斗大的字,说是哪位名人留下的。玉屏峰最险的地方是在一线天,上下达七八十度的落差,台阶狭,仅容一人,台阶窄,仅托一足,百米长,走多了,腿便打抖了,害怕了,还不时地叫着好刺激呀。
微信小程序欢迎页面:
先看下最后的效果图:
首先打开开发工具,创建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" } }
demo源码 :http://xiazai.haodaima.com/201701/yuanma/hyym(haodaima.com).rar
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
本文微信小程序 欢迎页面的制作(源码下载)到此结束。成功是别人失败时还在坚持。小编再次感谢大家对我们的支持!