• 小程序:组件(图片、图标、VIEW、进度条、父文本、按钮、开关、输入框、input)


    1、图片

    <cover-image src="../../resources/imgs/shouye.png"></cover-image>

    2、图标(长度为px)

    <icon type="warn" size="25"></icon>
    <icon type="success" size="28"></icon>
    <icon type="success_no_circle" size="30"></icon>
    <icon type="info" size="32"></icon>
    <icon type="waiting" size="32"></icon>

    3、VIEW

    <view hover-class="hover" hover-start-time="2000" hover-stay-time="3000">变色</view>

     停在文字上方2s后变为红色,红色的持续时间为3s

    .hover{
      color: red;
    }

    4、进度条

    <!--进度条-->
    <progress percent="70" show-info="{{true}}" stroke-width="8" activeColor="red" backgroundColor="black" active="forward"></progress>

    宽度为8,背景色为黑色,显示数据的部分为红色,并有显示特效,从左到右

    5、父文本

    <!--父文本,可以识别html的标签,把带有标签的写在node属性上-->
    <rich-text><h2>我是一个二级标题</h2></rich-text>

    6、按钮

    <!--按钮-->
    <button type="warn">warn</button>
    <button form-type="submit">提交</button>
    <button size="mini" loading="{{true}}">button按钮</button>

     可以选择格式、大小等

    7、开关选择器switch

    <switch type="checkbox"></switch>

    8、输入框

     <textarea bindblur="bindTextAreaBlur" auto-height placeholder="自动变高" placeholder-style="color:red;" />

     

     高度可以随着输入内容的多少而改变

    9、input标签

    <view>请输入:</view>
     <input  maxlength="10" placeholder="密码、10位" password="{{true}}"/>

  • 相关阅读:
    图书管理系统(spring springmvc)
    ssm框架整合(java个人博客系统)
    HTTP笔记
    (数据结构课程设计)稀疏矩阵运算器
    数据库学习笔记
    HTML5 3D旋转图片相册
    Mybatis分页插件-PageHelper的使用
    如何更改github工程的语言属性
    HttpServletResponse和HttpServletRequest详解
    node js 安装.node-gyp/8.9.4 权限 无法访问
  • 原文地址:https://www.cnblogs.com/zhai1997/p/13182534.html
Copyright © 2020-2023  润新知