css系列--块级元素靠右的实现方式

问题描述：
实现某一行中内部元素，靠右展示
HTML 如下：

<div class="parent"><div class="block"></div></div>

想要块级元素居右往往设置 margin-right: 0 属性是行不通的 此方案不可行！！

方法1：使用 margin 属性

.block{
    margin-left: auto;}

方法2：使用 position 属性

.parent{
  position: relative;}.block{
  position: absolute;
  right:0;}

方法3：使用 float 属性

.block{float: right;}

方法4：使用 text-align 属性

.parent{
  text-align: right;}.block{
  display: inline-block;}

将块设为行内元素,然后父元素使用 text-align: right; 是块到右边.
方法5：使用 flex 属性

.parent{
  display: flex;
  justify-content: flex-end;}

将父元素变为弹性容器, 然后将 justify-content 设为 flex-end, 那么容器中的弹性元素会从右开始排列.