网站建设之10种流行的Web排版框架和库

曾经有一段时间，网络排版只是将一些字体放在一起的问题。现在，现代网页设计已经发展到我们期望文字能做更多事情的地步。我们希望它能够响应用户的屏幕，自动适应指定的空间并提供其他高级功能。

借助一些出色的框架和库，您可以实现许多激动人心的排版效果。以下是我们收藏夹的集合。

baffle.js 

baffle.js为所需的文本添加了一个有趣的“模糊并揭示”效果。乍一看，文本显得乱七八糟。然后，动画序列会系统地显示文本字符串。有许多装饰用途，但这似乎是单词拼写游戏的绝佳基础。

适合度 

我们在网络排版中看到的一种趋势是使文本能够自动调整大小以适合其父容器。Fitty是一个很小的脚本，它将此功能添加到您的网站。它支持Web字体和多行文本。该脚本还将随着用户视口的更改而自动调整。

网站建设

Textillate.js 

Textillate.js结合了两种流行的文字动画库（animate.css和lettering.js）创建的文字特效一个超级强大的集合。在一个易于使用的jQuery插件中，您实际上可以追求任何类型的动画。

网站建设

反应文本渐变 

使用React Text Gradient向您的网站添加漂亮的文本渐变。这个React组件将检查是否background-clip可用。如果是这样，将对CSS应用渐变。否则，SVG梯度将用作后备。

网站建设

jQuery.auto-text-rotating 

jQuery.auto-text-rotating不是最流畅的名称-但是这个jQuery插件非常酷。您可以用多个可用的动画效果替换字符串中的文本。如果需要，您还可以在同一行中更改多个单词。

ShareSelectedText.js 

使用ShareSelectedText.js可将中型文本报价共享带到任何网站。用户需要做的就是选择一些文本，然后出现一个图标菜单-允许您在喜欢的任何支持的服务（Facebook，Twitter，Reddit，LinkedIn，Tumblr等）上共享。让用户共享对他们来说最重要的部分内容非常方便。

反应显示文字 

React Reveal Text是一个小型库，可显示带有动画的文本。它使用CSS过渡，这意味着配置非常简单。它的样式可以像您网站上的任何其他元素一样。对于英雄横幅或着陆页介绍而言，这可能是非常有用的效果。

Lettering.js 

Lettering.js是一个jQuery插件，允许在每个字母的基础上进行控制。很简单 调用脚本并定义与您要更改的文本相对应的CSS类或ID。该定义的类中的每个字母都变成具有span自己的类的HTML 。使用CSS将每个字母的样式设置为最大！

文字平衡器 

文本平衡器由《纽约时报》开发，该简单脚本的目的是从您的内容中删除印刷寡妇。您可以只在特定的CSS选择器上运行脚本，或者使用.balance-text该类在更广泛的范围内运行脚本。

Typed.js 

Typed.js接受文本字符串，然后在浏览器中“键入”文本字符串，将其删除并移至下一个字符串。它非常易于使用，是讲述故事的好方法。您可以设置任意数量的文本字符串（在脚本本身中或通过使用CSS选择器），键入它们的速度以及几个方便的选项。

这是你的类型

通过上述脚本的强大功能，Web版式可以远远超出典型的排版范围。现在，我们可以完全控制文本的外观和功能。就外观而言，曾经是印刷图形领域的特殊效果现在在网络上复制非常简单。工具使设计人员能够创建更好，更友好的用户体验，从而增强了功能。

对于下一个项目，请花点时间想象一下如何更好地实现排版以增强字体。然后，利用这些出色的工具之一来实现它。