如何在 IE9 中沿斜線左對齊文字？

在斜線上對齊文字

問題：

跟隨左時文字可以沿斜線對齊影像的角度和支持IE9嗎？

解決方案：

使用LESS：

實現所需的對齊，您可以添加額外的方形元素並使用LESS 計算其大小：

<code class="less">.loop(@i) when (@i > 0){
  .loop((@i - 1));
  .space@{i}{
    width: floor(@i*@hSize/(1/tan(5deg)));
  }
}
@hSize: 15px;
.space {
  float: left;
  clear: left;
  width: @hSize;
  height: @hSize;
}</code>

HTML:

<code class="html"><p>
  <span class="space space1"></span>
  <span class="space space2"></span>
  <!-- (...) -->
  <span class="space space11"></span>
  Lorem ipsum ...
</p></code>

概念證明：

http:/ /codepen.io/Tymek/pen/jEypOX?editors=110

以上是如何在 IE9 中沿斜線左對齊文字？的詳細內容。更多資訊請關注PHP中文網其他相關文章！