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>

 

2. 成员项

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

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

 

4. 开关

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

 

<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>

 

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>