<!DOCTYPE HTML>
<html>
<head>
<title>Vertical Font Fallback</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 20px;
font-family: Times;
}
.lrblock {
writing-mode: tb-lr; /* IE */
-webkit-writing-mode: vertical-lr;
height: 275px;
margin-bottom: 50px;
padding: 1px;
background-color: #eee;
}
.basic {
width: 275px;
margin: 0;
padding: 1px;
writing-mode: lr-tb; /* IE */
-webkit-writing-mode: horizontal-tb;
}
div.d0 {
background-color: #fee;
}
div.d1 {
background-color: #ffe;
}
p {
margin: 10% 5% 10% 5%;
background-color: #faa;
border-left: 20px solid #f88;
border-right: 20px solid #f88;
line-height: 1em;
padding: 1px;
}
.vert {
writing-mode: tb-rl; /* IE */
-webkit-writing-mode: vertical-rl;
}
</style>
</head>
<body>
<div class="lrblock">
<div class="basic d0"><p>第一段落 paragraph 1</p><p>第二段落 paragraph 2</p></div>
<div class="basic d1 vert"><p>第一段落 paragraph 1</p><p>第二段落 paragraph 2</p></div>
</div>
</body>
</html>