如何使iOS Broswers的垂直LR传统蒙古文本正确地进行分析？
使用写作模式设置为vertical-lr，包含传统蒙古人的文本框在iOS上不正确显示，如下图第一幅的第一部分所示。如果写作模式是水平-TB，则文本显示正常。如何在iOS/iPados上正确显示Vertical-LR模式中的蒙古文本？不过，垂直和水平模式可用于桌面浏览器。可以重现数字的HTML是：
<!DOCTYPE html>
<html>
<head>
<style>
@font-face {
font-family:'hawang';
src: url('A Traditional Mongolian Font File; Removed because of data sensitivity');
}
.mongol-text-vertical {
writing-mode: vertical-lr;
font-family: "hawang";
}
.mongol-text-horizontal {
writing-mode: horizontal-tb;
font-family: "hawang";
}
</style>
</head>
<body>
<h2>Vertical mode; wrong display</h2>
<div class="mongol-text-vertical">
<p>
ᠠᠷᠪᠠᠨ ᠬᠤᠶᠠᠷ ᠵᠢᠯ <br>
ᠮᠤᠡᠭᠭᠤᠯ ᠠᠷᠠᠳ ᠤᠨ ᠲᠠᠭᠤᠤ
</p>
</div>
<h2>Horizontal mode; wrong display</h2>
<div class="mongol-text-horizontal">
<p>
ᠠᠷᠪᠠᠨ ᠬᠤᠶᠠᠷ ᠵᠢᠯ <br>
ᠮᠤᠡᠭᠭᠤᠯ ᠠᠷᠠᠳ ᠤᠨ ᠲᠠᠭᠤᠤ
</p>
</div>
</body>
</html>
iPados上Firefox中的网页。
编辑：在桌面浏览器中添加了页面。
Windows 11上的Firefox中的网页。
With the writing-mode set to be vertical-lr, a text box containing traditional Mongolian doesn't display correctly on iOS as shown in the first part of the first figure below. If the writing-mode is horizontal-tb, the text displays just fine. How can I make the Mongolian text in the vertical-lr mode display correctly on iOS/iPadOS? The vertical and horizontal modes work fine for desktop browsers, though. The html that can reproduce the figures is:
<!DOCTYPE html>
<html>
<head>
<style>
@font-face {
font-family:'hawang';
src: url('A Traditional Mongolian Font File; Removed because of data sensitivity');
}
.mongol-text-vertical {
writing-mode: vertical-lr;
font-family: "hawang";
}
.mongol-text-horizontal {
writing-mode: horizontal-tb;
font-family: "hawang";
}
</style>
</head>
<body>
<h2>Vertical mode; wrong display</h2>
<div class="mongol-text-vertical">
<p>
ᠠᠷᠪᠠᠨ ᠬᠤᠶᠠᠷ ᠵᠢᠯ <br>
ᠮᠤᠡᠭᠭᠤᠯ ᠠᠷᠠᠳ ᠤᠨ ᠲᠠᠭᠤᠤ
</p>
</div>
<h2>Horizontal mode; wrong display</h2>
<div class="mongol-text-horizontal">
<p>
ᠠᠷᠪᠠᠨ ᠬᠤᠶᠠᠷ ᠵᠢᠯ <br>
ᠮᠤᠡᠭᠭᠤᠯ ᠠᠷᠠᠳ ᠤᠨ ᠲᠠᠭᠤᠤ
</p>
</div>
</body>
</html>
The webpage in Firefox on iPadOS.
Edit: added the page in a desktop browser.
The webpage in Firefox on Windows 11.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
事实证明，我必须将
文本定位设置为侧向，以使蒙古脚本在iOS/iPados上的浏览器中正确显示。我怀疑问题是iOS上的浏览器不支持垂直脚本，因此text-cortirientation（混合）的默认值只是不起作用，因为浏览器don' t知道如何自然地列出垂直脚本的字符（由MDN引用）。https://developer.mozilla.orgg/en-us/文档/Web/css/Text-Arientation
It turned out that I had to set
text-orientationassidewaysso as to make the Mongolian script show correctly in browsers on iOS/iPadOS. I suspect the problem is that browsers on iOS don't support vertical scripts so the default value oftext-orientation(mixed) just doesn't work since the browsers don't know how to Lays out the characters of vertical scripts naturally (quoted from MDN).https://developer.mozilla.org/en-US/docs/Web/CSS/text-orientation