jquery - 使段落中的所有行具有相同的宽度，无论字符数如何

Question

我正在为客户网站制作 GUI。这是一个 T 恤网站，他们想要一个非常简单且选项有限的设计师。

这很好，但是他们要求的选项之一是轻松地使所有线条具有相同的宽度。这会导致某些行的字体变大。

提供的文本位于一个文本字段中，然后我使用:

word-wrap: break-word;

打破该线以填充容器。

这最终将成为右侧的示例，而不是左侧的示例。

首选 CSS 是否可行，但也可以使用 JS。

Answer 1

BigText jQuery plugin有能力做你想做的事。

$('#bigtext').bigtext();

#bigtext{
  width:300px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://zachleat.github.io/BigText/dist/bigtext.js"></script>
<div id="bigtext">
  <span>SOME</span>
  <span>TOTALLY</span>
  <span>HIPSTER</span>
  <span>QUOTE</span>
  <span>ABOUT</span>
  <span>LIFE</span>
</div>