Question

我希望在博文中垂直对齐东亚文本，但不了解CSS。我希望它看起来像https://dl.dropboxusercontent.com/u/444684/OpenWebDemos/css3writingModes/japanese-upright.html。

我试图在我的博客中进行此操作，但每个角色都是垂直对齐的，而不仅仅是博文中的角色。这是我的博客：http://dandan-koushun.blogspot.com/

你能告诉我什么是错的吗？下面是我的CSS：

<!DOCTYPE html>
<html lang="ja">
<section>
    <meta charset="utf-8" />
    <style>
        html {
            font-size: 10px;
            width: 100%;

        }
        body {
            width: 100%;
            height: 34rem;
            margin-bottom: 8rem;

            -ms-writing-mode: tb-rl; /* old syntax. IE */
            -webkit-writing-mode: vertical-rl;
            -moz-writing-mode: vertical-rl;
            -ms-writing-mode: vertical-rl;
            writing-mode: vertical-rl; /* new syntax */   
        }

        h1 {
            text-shadow: 0 1px 1px grey;
            color: white;
            font-weight: bold;
            font-size: 3rem;
            padding: 11rem 12rem 0 0;    
        }    
        section {
            -ms-writing-mode: tb-rl; /* old syntax. IE */
            -webkit-writing-mode: vertical-rl;
            -moz-writing-mode: vertical-rl;
            -ms-writing-mode: vertical-rl;
            writing-mode: vertical-rl; /* new syntax */

        }


</html>

Answer 1

我要做的就是使用CSS3将div旋转90度，但他们做的是以下内容：

ms-writing-mode: tb-rl;
-webkit-writing-mode: vertical-rl;
-moz-writing-mode: vertical-rl;
-ms-writing-mode: vertical-rl;
writing-mode: vertical-rl;
-webkit-text-orientation: upright;
-moz-text-orientation: upright;
-ms-text-orientation: upright;
text-orientation: upright;

将其添加到父div。

如何在博客文章中垂直对齐日文文本？

1 个答案: