third_party/WebKit/LayoutTests/fast/writing-mode/vertical-font-fallback.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <head>
   4 <title>Vertical Font Fallback</title>
   5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   6
   7 <style type="text/css">
   8
   9 body {
  10   margin: 50px;
  11   font-size: 20px;
  12   font-family: Times;
  13 }
  14
  15 .lrblock {
  16   writing-mode: tb-lr;  /* IE */
  17   -webkit-writing-mode: vertical-lr;
  18   height: 275px;
  19   margin-bottom: 50px;
  20   padding: 1px;
  21   background-color: #eee;
  22 }
  23
  24 .basic {
  25   width: 275px;
  26   margin: 0;
  27   padding: 1px;
  28   writing-mode: lr-tb;  /* IE */
  29   -webkit-writing-mode: horizontal-tb;
  30 }
  31
  32 div.d0 {
  33   background-color: #fee;
  34 }
  35
  36 div.d1 {
  37   background-color: #ffe;
  38 }
  39
  40 p {
  41   margin: 10% 5% 10% 5%;
  42   background-color: #faa;
  43   border-left: 20px solid #f88;
  44   border-right: 20px solid #f88;
  45   line-height: 1em;
  46   padding: 1px;
  47 }
  48
  49 .vert {
  50   writing-mode: tb-rl;  /* IE */
  51   -webkit-writing-mode: vertical-rl;
  52 }
  53
  54 </style>
  55 </head>
  56 <body>
  57
  58 <div class="lrblock">
  59 <div class="basic d0"><p>第一段落 paragraph 1</p><p>第二段落 paragraph 2</p></div>
  60 <div class="basic d1 vert"><p>第一段落 paragraph 1</p><p>第二段落 paragraph 2</p></div>
  61 </div>
  62
  63 </body>
  64 </html>