如何在 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中文网其他相关文章！