文档章节

Ionic css组成(三)

博为峰教研组
 博为峰教研组
发布于 2017/03/25 20:25
字数 230
阅读 9
收藏 0

三.、界面组件类

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元素上。

3. 按钮

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

 

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>

 

© 著作权归作者所有

博为峰教研组
粉丝 51
博文 1224
码字总数 479077
作品 0
黄浦
程序员
私信 提问
ionic教程之基本布局

目录: 简介 Hybrid vs. Others ionic CSS框架 基本布局 布局模式 定高条块:.bar .bar : 位置 .bar : 嵌入子元素 .bar : 嵌入input 内容:.content和.scroll-content Hybrid vs. Others 要开...

汇智网
2017/09/18
0
0
ionic框架安装

ionic框架安装 导语 ionic是一个强大的混合式/hybridHTML5移动开发框架,特点是使用标准的HTML、 CSS和JavaScript,开发跨平台(目前支持:Android、iOS,计划支持:Windows Phone、Firefox...

90后爱国
2016/07/05
176
0
Ionic vs React Native: 前端框架之争,谁更胜一筹?

选择合适的平台是开发人员在创建移动应用程序时面临的主要问题之一。据统计,iOS 和 Android 两大巨头已经有超过了十年的竞争。为了从软件开发的预算效益和时间效益的角度来寻求两个平台之间...

王练
2018/02/18
13.9K
6
Ionic vs React Native: 前端框架之争,你用的是哪一个

选择合适的平台是开发人员在创建移动应用程序时面临的主要问题之一。据统计,iOS 和 Android 两大巨头已经有超过了十年的竞争。为了从软件开发的预算效益和时间效益的角度来寻求两个平台之间...

周其
2018/02/22
3.9K
2
ionic入门之AngularJS扩展(一)//HTML5移动开发

ionic ionic是一个强大的混合式/hybridHTML5移动开发框架,特点是使用标准的HTML、 CSS和JavaScript,开发跨平台(目前支持:Android、iOS,计划支持:Windows Phone、Firefox OS) 的原生A...

秦无炎
2016/12/20
41
0

没有更多内容

加载失败,请刷新页面

加载更多

3_数组

3_数组

行者终成事
今天
7
0
经典系统设计面试题解析:如何设计TinyURL(二)

原文链接:https://www.educative.io/courses/grokking-the-system-design-interview/m2ygV4E81AR 编者注:本文以一道经典的系统设计面试题:《如何设计TinyURL》的参考答案和解析为例,帮助...

APEMESH
今天
7
0
使用logstash同步MySQL数据到ES

概述   在生成业务常有将MySQL数据同步到ES的需求,如果需要很高的定制化,往往需要开发同步程序用于处理数据。但没有特殊业务需求,官方提供的logstash就很有优势了。   在使用logstas...

zxiaofan666
今天
10
0
X-MSG-IM-分布式信令跟踪能力

经过一周多的鏖战, X-MSG-IM的分布式信令跟踪能力已基本具备, 特点是: 实时. 只有要RX/TX就会实时产生信令跟踪事件, 先入kafka, 再入influxdb待查. 同时提供实时sub/pub接口. 完备. 可以完整...

dev5
今天
7
0
OpenJDK之CyclicBarrier

OpenJDK8,本人看的是openJDK。以前就看过,只是经常忘记,所以记录下 图1 CyclicBarrier是Doug Lea在JDK1.5中引入的,作用就不详细描述了,主要有如下俩个方法使用: await()方法,如果当前线...

克虏伯
今天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部