如何使用离子图标内嵌选择图标

时间:2017-06-03 05:17:55

标签: css css-position ionic2-select

我在按钮标签内有一个图标。 我还有一个选择下拉菜单,我想将其箭头图标直接与心脏图标对齐。我认为我可以通过常规的css定位来做到这一点,但除非我完全从按钮标签内部删除选择图标,否则图标将不会按标准css定位的方式移动。

        <button class="toolbarButtons" ion-button >

                <ion-select id="select">
                  <ion-option value="NY">New York</ion-option>
                  <ion-option value="BO">Boston</ion-option>
                 </ion-select>

              <ion-icon name="heart">Change City</ion-icon>
     </button>

1 个答案:

答案 0 :(得分:1)

如果使用班级版本,您将对离子图标有更多控制权。这样你就可以随心所欲地改变它。

示例:

    <tag class="ion-heart"> text </tag>

您可以使用此类自定义大小调整,或创建自己的自定义大小。

要显示带箭头内联的心脏,您可以查看此网站,看看它是否对您有用。 http://blog.fontawesome.io/2014/05/19/stacking-text-and-icons/ 它使用的是不同的图标字体,但它应该会有所帮助。