ionic使用记录----button

按钮 : .button

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

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

一旦元素应用了.button样式，就可以继续选用两类预定义样式来进一步声明元素及其内容的外观：

1. 同级样式 - 同级样式与.button应用在同一元素上，声明元素的位置、配色等。
2. 下级样式 - 下级样式只能应用在.button的子元素上，声明子元素的大小等特征。

.button : 嵌入图标

使用内置的Ionicons样式，图标可以很容易地加入到.button中：

<a class="button">
    <i class="icon ion-home"></i>Home
</a>

但是更简洁的办法是：直接在.button上设置样式，这样可以有效减少元素的数目：

<a class="button icon-left ion-home">...</a>

• .icon-left - 将图标置于按钮左侧
• .icon-right - 将图标置于按钮右侧

在列表中使用按钮

和插入图标类似，向.item中插入按钮需要满足两个条件：

1. 在.item元素上声明按钮位置。按钮可以位于列表的左侧或右侧，分别使用.item-button-left和.item-button-right声明
2. 在.item元素内插入按钮。