css - 如何获得与 ionic 图标内联的选择图标

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

最佳答案

如果您使用类版本,您将更好地控制 Ion 图标。这样你就可以随心所欲地改变它。

例子:

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

您可以使用此类来自定义尺寸,或创建您自己的自定义尺寸。

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

关于css - 如何获得与 ionic 图标内联的选择图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44340566/

相关文章:

ionic2 - 如何在 ionic2 中自定义 ionic 选择弹出窗口的宽度和高度

ionic2 - 如何在 Ionic 2 中的选择组件内使用图像

css - Rails 3.2 在 Controller (不是整个 Controller )中使用不同的 CSS 页面进行一些操作

CSS 列表下拉菜单

javascript - 垂直对齐范围

html - css flexbox 包装 : analogue of pseudo-classes to select start/end items on main/cross axis?

html - 将 div 放置在覆盖层内

css - HTML/CSS 细节 : How do I place "pins" on a resizeable "map"?

html - 将导航高度放在页脚,而不是固定位置