附录1-小程序常用标签

目录

1  view

2  scroll-view

3  swiper与swiper-item

4  text

5  rich-text

6  button

7  image


1  view

相当于html的div

附录1-小程序常用标签_第1张图片

附录1-小程序常用标签_第2张图片

2  scroll-view

scroll-view是一个有滚动条的div

附录1-小程序常用标签_第3张图片

scroll-y是允许纵向滚动,scroll-x是允许横向滚动

附录1-小程序常用标签_第4张图片

附录1-小程序常用标签_第5张图片

3  swiper与swiper-item

swiper是做轮播图用的

附录1-小程序常用标签_第6张图片

indicator-dots是轮播图下方的点,如果不写就没有点

附录1-小程序常用标签_第7张图片

swiper的常用属性还有下面这些,如果不加circular,那么切换到第三张的时候再往右拖是不会拖到第一张的,如果加上circular,切换到第三张的时候再往右拖可以拖到第一张

附录1-小程序常用标签_第8张图片

附录1-小程序常用标签_第9张图片

4  text

相当于html中的span

附录1-小程序常用标签_第10张图片

只写text你在手机上是不能选中的,我们可以加上selectable实现长按选中文本内容的效果

附录1-小程序常用标签_第11张图片

5  rich-text

rich-text可以通过nodes属性渲染html字符串

附录1-小程序常用标签_第12张图片

6  button

默认情况下按钮独占一行,使用size='mini'可以让按钮不独占一行

附录1-小程序常用标签_第13张图片

可以通过open-type属性调用微信的功能

7  image

项目文件都存储在本地,我们先在页面文件夹中放一张图片

附录1-小程序常用标签_第14张图片

之后将图片粘贴进去就好了

附录1-小程序常用标签_第15张图片

图像有默认的宽高,宽约300px,高约240px

附录1-小程序常用标签_第16张图片

mode属性用来指定图片的裁剪和缩放

附录1-小程序常用标签_第17张图片

你可能感兴趣的:(微信小程序开发,小程序)