是否可以使用CSS来确保文本始终以相同的方式显示?

时间:2014-07-05 04:28:22

标签: html css

我正在制作古兰经应用程序(古兰经是穆斯林的神圣文本),市场上已经有很多这样的应用程序,但我想到的那个应用程序有点特别。

有两种类型的古兰经应用程序:类似于纸质副本的特定版本的类型(即,无论出版商如何,页面1在所有副本中看起来完全相同)。这些应用程序的问题在于它们使用图像来确保每个页面看起来完全相同,这是不必要的带宽,也不是很灵活。这也不允许用户选择单独的经文(例如,获得翻译或听到该特定经文的叙述)。

实施例: Mushaf Madina

另一种古兰经是使用文本的类型,并允许选择诗歌的灵活性。当然,需要注意的是,没有“页面”,应用程序往往只是将每个节目都放在自己的行上(必要时包裹起来)。

实施例: iQuran

第二种古兰经应用程序的问题在于古兰经是最受瞩目的书籍之一。人们记住它的一种方式是按页面上的位置。

所以我想把这两个世界结合起来。我想使用文本来渲染古兰经,但我也希望它看起来与纸质版本,页面页面,行直线相似。

这可能吗?

这就是我所拥有的(非常粗糙): http://jsfiddle.net/abustamam/wGJzm/1/

这是我的CSS:

@font-face {
    font-family: Arabz;
    src: url(https://dl.dropboxusercontent.com/u/17145089/tyaslab/KFGQPCUthmanTahaNaskh.ttf);
}

p {
    font-family: Arabz;
    text-align: justify; /*To justify the text, all the books do this */
    font-size: 26px; 
}

谢谢!

编辑2:进一步反思后,定义因素将是找到一种字体。由于没有单一的模式来管理古兰经的剧本(有时候同一个词可以根据上下文不同地写出来),我认为这不存在字体。在这个问题的上下文中,使用任何其他字体在理论上都可以工作,但是由于它不模仿物理文本,所以不会有人会使用它。

1 个答案:

答案 0 :(得分:1)

您可以使用一些CSS属性来获得图像质量。

body {
    background-image: url(BACKGROUND_IMAGE_URL_HERE);
    background-size: cover;
}

然后

text-align: justify /*To justify the text, all the books do this */
font-size: CUSTOME_SIZEpx /* With justify and this you can control very rigorously your page content to fit exactly as the original book does */

当您使用文本方法时,您将按照诗歌选择的方式进行操作。