html + css 文字左右对齐

问题描述

问 题

如下图中红框中的文字, 字数不同时有什么好的方式实现这种左右对齐

解决方案

楼上的text-align-last有兼容性问题，可以用下面这样

html

<div class="justify">汪 星 人</div>
<div class="justify">那 美 克 星 人</div>
<div class="justify">地 球 男 人</div>

css

  .justify {
    text-align: justify;
    width: 200px;
    border: 1px solid blue;
    height: 18px;
  }

  .justify::after {
    content: "";
    display: inline-block;
    width: 100%;
  }

这篇关于html + css 文字左右对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！