justify-content
在 flax 布局中,justify-content 用於設置或檢索彈性盒子元素在主軸(橫軸)方向上的對齊方式。
示例:
<div style="display: flex; justify-content: space-between">
<el-button size="small" type="primary" icon="el-icon-plus">添加工資賬套</el-button>
<el-button size="small" type="success" icon="el-icon-refresh"></el-button>
</div>
justify-content 的屬性值如下:
align-content
在 flax 布局中,align-content 屬性在彈性容器內的各項沒有占用交叉軸上所有可用的空間時對齊容器內的各項(垂直)。
注意:容器內必須有多行的項目,該屬性才能渲染出效果。
align-content 的屬性值如下:
text-align 與 align
- align :規定 div 元素中的內容的水平對齊方式。
- text-align:規定“元素中”的文本的水平對齊方式。
兩個屬性使用的地方不一樣,但是作用一樣。
示例:
<div align="center">
This is some text!
</div>
-----------
<div style="text-align:center">
This is some text!
</div>
參考資源
https://blog.csdn.net/qq_42058441/article/details/86555589
https://www.runoob.com/cssref/css3-pr-align-content.html
https://www.runoob.com/cssref/css3-pr-justify-content.html?_t_t_t=0.005738589571130381
每天學習一點點,每天進步一點點。