<figure>
    <img src="https://www.w3cplus.com/sites/default/files/blogs/2016/1606/text-align-last-demo.jpg" alt=""  width="300" />
    <figcaption>W3cplus是一个致力于推广国内前端行业的技术博客。它以探索为己任，不断活跃在行业技术最前沿，努力提供高质量前端技术博文；其文章范围广泛，主要以CSS3、HTML5、Sass、Mobile和各类DEMO为主。</figcaption>
</figure>
<figure>
    <img src="https://www.w3cplus.com/sites/default/files/blogs/2016/1606/text-align-last-demo.jpg" alt=""  width="300" />
    <figcaption>W3cplus是一个致力于推广国内前端行业的技术博客。它以探索为己任，不断活跃在行业技术最前沿，努力提供高质量前端技术博文；其文章范围广泛，主要以CSS3、HTML5、Sass、Mobile和各类DEMO为主。</figcaption>
</figure>

html,
body {
  width: 100vw;
  height: 100vh;
  text-align: center;
}


figure {
  display: inline-block;
  margin: 15px;
  padding: 10px;
  border-radius: 5px;
  background-color: #eee;
  width: 300px;
  
  &:nth-child(1) figcaption {
    direction: ltr;
    text-align-last: end;
  }
  &:nth-child(2) figcaption {
    direction: rtl;
    text-align-last: end;
  }
}

figcaption {
  font-size: 12px;
  margin-top: 10px;
  line-height: 1.5;
  text-align: left;
}