Ionic css组成(三)

三.、界面组件类

1. 列表

使用.list定义列表容器, 使用.item定义列表成员:

<any class="list">

    <any class="item">...</any>

    <any class="item">...</any>

    <any class="item">...</any>

    <any class="item">...</any>

</any>

006zipb5zy79MKwuC3L51&690 

2. 成员项

列表的样式定制主要发生在.item元素上。

006zipb5zy79MKzX7Wf4f&690

3. 按钮

ionic使用.button样式定义按钮元素

006zipb5zy79MKASY9270&690 

4. 开关

开关通常用来设置两种状态 - 开启和关闭

006zipb5zy79MKBAulp97&690 

<any class="item item-toggle">

iMessage

<label class="toggle toggle-balanced">

<input type="checkbox">

<div class="track">

<div class="handle"></div>

</div>

</label>

</any>

 

5. 复选

复选框通常用来在一组列表中选中部分成员

<any class="item item-chexkbox">

    <any class="checkbox">

        <input type="checkbox">

    </any>

</any>

006zipb5zy79MKCixwZ11&690 

6. 单选

<label class="item item-radio">

<input type="radio" name="group">

<div class="item-content">f支付宝客户端支付</div>

<i class="radio-icon ion-checkmark assertive"></i>

</label>

单选按钮通常不单独使用,将他们放入一个列表中

<any class="list">

    <any class="item item-radio">...</any>

    <any class="item item-radio">...</any>

    ...

</any>

006zipb5zy79MKD0j6T27&690 

转载于:https://my.oschina.net/u/2971691/blog/867360

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值