WEB骇客
    <table>
    <tr>
        <th>属性值</th>
        <th>竖向文本</th>
        <th>横向文本</th>
        <th>混合文本</th>
    </tr>
    <tr>
        <td>horizontal-tb</td>
        <td><div class="exampleText1">我家没有电脑。</div></td>
        <td><div class="exampleText1">Example text</div></td>
        <td><div class="exampleText1">1994年に至っては</div></td>
    </tr>
    <tr>
        <td>vertical-lr</td>
        <td><div class="exampleText2">我家没有电脑。</div></td>
        <td><p class="exampleText2">Example text</div></td>
        <td><div class="exampleText2">1994年に至っては</div></td>
    </tr>
    <tr>
        <td>vertical-rl</td>
        <td><div class="exampleText3">我家没有电脑。</div></td>
        <td><div class="exampleText3">Example text</div></td>
        <td><div class="exampleText3">1994年に至っては</div></td>
    </tr>
    <tr>
        <td>sideways-lr</td>
        <td><div class="exampleText4">我家没有电脑。</div></td>
        <td><div class="exampleText4">Example text</div></td>
        <td><div class="exampleText4">1994年に至っては</div></td>
    </tr>
    <tr>
        <td>sideways-rl</td>
        <td><div class="exampleText5">我家没有电脑。</div></td>
        <td><div class="exampleText5">Example text</div></td>
        <td><div class="exampleText5">1994年に至っては</div></td>
    </tr>
</table>

 table { border-collapse:collapse; }
td, th {border: 1px black solid; padding: 3px; }
th {background-color: lightgray; }
.exampleText1 { width:75px; -webkit-writing-mode: horizontal-tb; -moz-writing-mode: horizontal-tb; -ms-writing-mode: horizontal-tb; writing-mode: horizontal-tb;}
.exampleText2 { height:75px; -webkit-writing-mode: vertical-lr; -moz-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr; writing-mode: vertical-lr;}
.exampleText3 { height:75px; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl;}
.exampleText4 { height:75px; -webkit-writing-mode: sideways-lr; -moz-writing-mode: sideways-lr; -ms-writing-mode: sideways-lr; writing-mode: sideways-lr;}
.exampleText5 { height:75px; -webkit-writing-mode: sideways-rl; -moz-writing-mode: sideways-rl; -ms-writing-mode: sideways-rl; writing-mode: sideways-rl;}
返回