1.微信小程序创建项目。
文件结构:小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。 一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下: 文件 必填 作用 app.js 是 小程序逻辑 app.json 是 小程序公共设置 app.wxss 否 小程序公共样式表 一个小程序页面由四个文件组成,分别是: 文件类型 必填 作用 js 是 页面逻辑...
2.项目启动页
*.json:app.json文件来对微信小程序进行全局配置,决定页面文件的路径、主文件入口、窗口表现、设置网络超时时间、设置多 tab 等,不允许有注释。
配置地址:https://mp.weixin.qq.com/debu...
最外面app.json配置路径默认首页:(路径不需要写文件类型,一个文件夹中的文件都只为一个页面服务,在编写外面css样式中也无需在wxml中引入wxss文件)
{ "pages": [ "page/welcome/welcome" ] }
pages数组中第一项为启动页面
*.json创建bug:json文件不能为空,至少保留{}
在配置的默认首页中的welcome.wxml文件中编写小程序的tag
welcome.xwml
<view> <image src="./image/xx.png" style="width:200rpx;height:200rpx"> </image> <text>第一个小程序</text> </view>
view:相当于html的div容器
image:等同于img
text:存放文字的标签,如果不加,在手机上无法长按选中文字。
rpx单位:和设计图等同大小即可,大小是px的一半。
page:生成页面后会默认的给最外面加个page标签,相当于html中的body
welcome.wxss
.user-main{ text-align:center; } .user-tx{ width:200rpx; height:200rpx; border-radius:50%; }
什么时候写行内样式,什么时候写wxss中?
在写静态固定的样式时写到外部引入中,经常变化或与行为发生互动的样式可以写到行内。
3.组件-轮播(swiper)
<swiper autoplay="true">
<swiper-item>轮播一</swiper-item>
<swiper-item>轮播二</swiper-item>
<swiper-item>轮播三</swiper-item>
</swiper>
设置轮播图片大小先设置swiper大小然后设置图片大小。
属性
autoplay:自动播放轮播
indicator-dots:是否有点
更多属性参考:http://suo.im/1QzaIi
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。