1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > html网页显示蒙文 网页标签中显示蒙古文竖排文本

html网页显示蒙文 网页标签中显示蒙古文竖排文本

时间:2019-03-13 08:57:58

相关推荐

html网页显示蒙文 网页标签中显示蒙古文竖排文本

网页标签中显示蒙古文竖排文本

蒙古文网页和我们经常见到的网页最大的区别在于,在网页中蒙古文文本的显示和编辑不同于其他的网站,蒙古文是竖排文本,并且不像汉文是从左向右书写文字,从上到下换行。而蒙古文是从上到下书写,从左向右换行。这就是在这里把蒙古文网页排版单独写出来的原因。

在我们的生活中,很少能看到蒙古文网站,我也是前一段在做一个项目中遇到的,并因此对蒙古文网站做了深入的研究。蒙古文网页在互联网缺少的原因就在于,它不同于我们正常网页的书写习惯,不管是在网页编辑还是浏览过程中,都会遇到麻烦。蒙古文的字库编码也很特殊,如果我们没有下载相应的蒙古文字体,那么我们浏览蒙古文网页时,就无法看到网页内容。而且大部分的浏览器都不支持蒙古文网站,一般情况下都会使用chrome,IE8以下的版本都无法支持显示蒙古文网页。

首先想让文字竖排显示,比较容易的方法有两种:

一,插入图片

我们可以使用制图软件制作图片,使用文本输入将蒙古文文字输入进去,并且我们可以根据自己的需求设计文字字体,图片样式等,这样既能够解决竖排文字输入问题,同时也让网页更加美观,一举两得!如图所示:

但是这种方法仅适合于较少的文字版块,如果我们的网页中某一部分文字较多,就不适合再用这种方法了。如果将长篇的文章做成图片,就不便于修改内容,而且过于大的图片会影响打开网页的速度,造成不必要的损失。

二、CSS样式设置

在CSS的文字处理属性中有一个重要的属性:writing-mode。该属性用于设置对象书写方向。

在 CSS2中对 writing- mode 定义如下:

语法: writing-mode : lr-tb、tb-rl

参数:lr-tb: 从左向右, 从上往下tb-rl: 从上往下, 从右向左

示例:div { writing-mode: tb-rl; }

CSS2的writing-mode实现了网页的竖排文字排版,但是它只符合汉字的书写顺序,而蒙古文是从左向右书写的,

然而现在最流行的网页样式列表已经被CSS3代替,CSS3是CSS2的升级,比CSS2更加完善。在新的CSS3中,writing-mode属性有了重新定义,更新了对多种语言的支持,包括蒙古文在内。

示例:

div { writing-mode: tb-lr }

其实就是改变了文字书写的方向,CSS2中writing-mode: tb-rl中rl的定义就是从右向左,而在CSS3中支持lr定义,也就是从左向右,所以在CSS3没有被完全支持使用之前,有人把CS2中writing-mode: tb-rl的值改为writing-mode: tb-lr也是可行的。

浏览器兼容

有了竖排显示的样式,我们还要考虑到兼容问题,对于不同的浏览器,我们要写不同形式的样式代码,

例如:

-webkit-writing-mode: vertical-lr;

-webkit-text-orientation: sideways-right;

writing-mode: tb-lr;

-ms-writing-mode: vertical-lr;

注意:这种方法兼容大部分的浏览器,但是IE6以下的版本除外。现在不管是什么网站,IE6以下的版本兼容性都很差,所以大部分人已将放弃了IE6及以下的版本。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。