脚本宝典收集整理的这篇文章主要介绍了Angular Material 教程之布局篇 (四) : 子元素对齐,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
子元素对齐
layout-align
指令需要两值。 第一个值表示子元素如何在布局的水平方向上对齐,第二个值表示子元素如何在布局的垂直方向上对齐。
当指令中只有一个值的时候。 例如,layout="row" layout-align="center"
将使元素居中水平,并垂直使用默认行为。
layout="column" layout-align="center end"
将使子元素沿着中心垂直和沿着水平端(右)对齐。
API
在布局容器中设置子元素对齐
layout-align
设置默认对齐,除非被另一个断点覆盖。
layout-align-xs
width < 600px
layout-align-gt-xs
width >= 600px
layout-align-sm
600px <= width < 960px
layout-align-gt-sm
width >= 960px
layout-align-md
960px <= width < 1280px
layout-align-gt-md
width >= 1280px
layout-align-lg
1280px <= width < 1920px
layout-align-gt-lg
width >= 1920px
layout-align-xl
width >= 1920px
这里是可用的布局参数和对齐参数:
布局方向
对齐方向(水平)
对齐方向(垂直)
row
none
none
column
start (默认)
start
center
center
end
end
space-around
stretch (默认)
space-between
以上是脚本宝典为你收集整理的Angular Material 教程之布局篇 (四) : 子元素对齐全部内容,希望文章能够帮你解决Angular Material 教程之布局篇 (四) : 子元素对齐所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。