相关疑难解决方法(0)

大家好,我已经问了一段时间,这一直困扰着我一段时间,问题本身就在标题中:

编写具有垂直标题的HTML表格的首选方法是什么？

通过垂直标题我的意思是该表<th>在左侧(通常)具有header()标记

标题1数据数据数据
标题2数据数据数据
标题3数据数据数据

他们看起来像这样,到目前为止我已经提出了两个选择

第一选择

   
    <table id="vertical-1">
            <caption>First Way</caption>
            <tr>
                <th>Header 1</th>
                <td>data</td><td>data</td><td>data</td>
            </tr>
            <tr>
                <th>Header 2</th>
                <td>data</td><td>data</td><td>data</td>
            </tr>
            <tr>
                <th>Header 2</th>
                <td>data</td><td>data</td><td>data</td>
            </tr>
        </table>
   

这种方式的主要优点是,你必须在头右(实际上左)旁边,它所表示的数据,我不但是喜欢就是<thead>,<tbody>和<tfoot>标签丢失,而且也没有办法,包括他们没有打破nicelly将元素放在一起,这引导我进入第二种选择.

第二选择

   
        <style type="text/css">
            #vertical-2 thead,#vertical-2 tbody{
                display:inline-block;
            }

        </style>
        <table id="vertical-2">
            <caption>Second Way</caption>
            <thead>
                <tr>
                    <th colspan="3">Header 1</th>
                </tr>
                <tr>
                    <th colspan="3">Header 2</th>
                </tr>
                <tr>
                    <th colspan="3">Header 3</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>row 1</td>
                    <td>row 1</td>
                    <td>row 1</td>
                </tr>
                <tr> …