angular - 如何水平对齐离子网格单元的内容
问题描述
使用 ion-grid 时,如何将单元格的内容水平对齐到单元格的左/右/中心?
<ion-grid>
<ion-row>
<ion-col class="ion-align-self-left">
left
</ion-col>
<ion-col class="ion-align-self-right">
right
</ion-col>
</ion-row>
</ion-grid>
内容总是左对齐,我希望文本“右”对齐到它自己的单元格的右侧。
解决方案
您只需要使用此处记录ion-text-end
的css 类:
<ion-grid>
<ion-row>
<ion-col class="ion-text-start">
left
</ion-col>
<ion-col class="ion-text-end">
right
</ion-col>
</ion-row>
</ion-grid>
呈现为:
顺便说一句:您尝试使用的 flex 选项是错误的类。在 Ionic4 中,它是start 和 end 而不是 left 和 right。
推荐阅读
- php - 数据库中的 PHP 下拉列表 - 如何按日期将选择限制为 8
- python - 如何在 tensorflow.js 上加载/重新训练/保存 ssd_inception_v2_coco?
- c - 尝试将整数写入 C 中的共享内存时出现分段错误(核心转储)
- python - 程序在数组中查找重复项并将它们放在 python 中唯一的后面?
- mysql - mysql bash命令在mobaextreme中失败,但n cmd windows成功
- python - 所选环境中没有 Pip 安装程序
- python - 帖子不显示
- c# - C#如何使用日期时间选择器选择过去的日期
- masstransit - 创建不同的消息或在 Masstransit 中进行某种过滤
- python - ipyleaflet TypeError: _handle_leaflet_event() 采用 3 个位置参数,但给出了 4 个