Question

我要提出的这个问题很难表达，所以如果你认为我的表达没有反映我想要的内容，请提前纠正我，谢谢你。

我正在开发一本电子书移动应用。我需要考虑的事情是： 1.屏幕尺寸 2.字体大小 3.根据当前屏幕尺寸和字体大小，我应该在一个页面中放置多少段。

我想在更大的屏幕上使用更大的字体，所以我不知道如何决定应该将多少段放入一个页面。我将数据作为整篇文章，但不知道何时何地将其分解为页面。

欢迎任何建议或想法。

更新

好的，让我更详细一点。

说我有一篇文章：

var arti = "Stack Overflow is a website, the flagship site of the Stack Exchange Network,[2][3] created in 2008 by Jeff Atwood and Joel Spolsky,[4][5] as a more open alternative to earlier Q&A sites such as Experts Exchange. The name for the website was chosen by voting in April 2008 by readers of Coding Horror, Atwood's popular programming blog.[6]
It features questions and answers on a wide range of topics in computer programming.[7][8][9] The website serves as a platform for users to ask and answer questions, and, through membership and active participation, to vote questions and answers up or down and edit questions and answers in a fashion similar to a wiki or digg.[10] Users of Stack Overflow can earn reputation points and "badges"; for example, a person is awarded 10 reputation points for receiving an "up" vote on an answer given to a question, and can receive badges for their valued contributions,[11] which represents a kind of gamification of the traditional Q&A site or forum. All user-generated content is licensed under a Creative Commons Attribute-ShareAlike license.[12]
As of August 2013, Stack Overflow has over 1,900,000 registered users and more than 5,500,000 questions.[13][14] Based on the type of tags assigned to questions, the top eight most discussed topics on the site are: C#, Java, PHP, JavaScript, Android, jQuery, C++ and Python.[15]";

我用来测试我的应用程序的手机的屏幕尺寸为1280 * 760，只能在一个屏幕上显示大约X个字符。

所以我的程序应该在第X，2 * X，3 * X，......等字符末尾打破arti的内容。

所以问题是我不知道如何计算X.

Answer 1

我建议为较小的屏幕使用更大的字符！

Answer 2

只是为了扩展我的评论。（不是主观的答案）

使用宽度的ems可以告诉我们包含元素的宽度是多少字体。

考虑

<style>

body { font size: 0.8em; } /* roughly about 14 px */
.container {  width: 30em; } /* 1em now equals 0.8 */

</style>

我们现在知道（或尽可能接近），<div class="container"> .. </div>可以保存带有（接近）30个字符行的文本。

这里的好处是如果我们改变字体大小：

<style>

body { font size: 1.2em; }

</style>

容器宽度也会发生变化，我们保留每行的设定字符数。因此，我们在布局和排版之间建立了联系，并且可以控制在我们的设计中“固定”段落长度和间距。

当我们需要根据适应不同尺寸并处理动态文本和字体大小的布局来计算布局元素的高度，宽度和设计的“分页符”时非常有用。

Answer 3

一种可能的解决方案是将div调整为设备视口的大小，然后使用https://github.com/olegskl/fitText

如何在一个移动页面中放置适量的字符（页面和字体大小将在不同的移动设备上更改）

3 个答案: