我有一个表格格式。我想将其转换为html

时间:2017-08-23 06:31:20

标签: html css html5

我对html设计并不熟悉。 我想在给定的图像中获得一个html表。任何人都有心想帮助我,请帮忙。 enter image description here

我从一些代码开始。但是没有完成。请帮忙 HTML

<html>
<body >
    <table border=1  width="100%">
        <tr>
            <td colspan=2 align="center">
                Cost Analysis Report
            </td>
        </tr>
        <tr>
            <td align="center">
                Purchase
            </td>
            <td align="center">
                Sales
            </td>
        </tr>
    </table>
</body>
</html>

3 个答案:

答案 0 :(得分:1)

如果能为你工作,请告诉我。

    <table border=1  width="100%">
        <tr>
            <td colspan=24 align="center">
                Cost Analysis Report
            </td>
        </tr>
        <tr>
            <td colspan=8 align="center">
                Purchase
            </td>
            <td colspan=8 align="center">
                Sales
            </td>
            <td colspan=8 align="center">
                Tax
            </td>
        </tr>
        <tr>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                1
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                2
            </td>
            <td align="center">
                3
            </td>
            <td align="center">
                3
            </td>
             <td align="center">
                3
            </td>
        </tr>
    </table>

答案 1 :(得分:1)

   <html>
   <body >
   <table border=1  width="100%">
   <thead>
    <tr>
        <th colspan="23" align="center">
            Cost Analysis Report
        </th>
    </tr>
    <tr>
        <th colspan="10" align="center">
            Purchase
        </th>
        <th colspan="10" align="center">
            Sales
        </th>
       <th colspan="3" align="center">
            Tax
        </th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td align="center">
            id
        </td>
        <td align="center">

        </td>
         <td align="center">

         </td>
         <!--just continue-->
    </tr>
    </tbody>
    </table>
    </body>
    </html>

答案 2 :(得分:1)

这是结构。随意定制设计,每个单元的所有颜色和价值。

<table border=1  width="100%">
<tr>
  <td colspan="23"><center>Cost Analysis</center></td>
</tr>
<tr>
  <td colspan="10"><center>Purchase</center></td>
  <td colspan="10"><center>Sales</center></td>
  <td colspan="3"><center>Tax</center></td>
</tr>
<tr>
  <td><center>1</center></td>
  <td><center>2</center></td>
  <td><center>3</center></td>
  <td><center>4</center></td>
  <td><center>5</center></td>
  <td><center>6</center></td>
  <td><center>7</center></td>
  <td><center>8</center></td>
  <td><center>9</center></td>
  <td><center>10</center></td>
  <td><center>11</center></td>
  <td><center>12</center></td>
  <td><center>13</center></td>
  <td><center>14</center></td>
  <td><center>15</center></td>
  <td><center>16</center></td>
  <td><center>17</center></td>
  <td><center>18</center></td>
  <td><center>19</center></td>
  <td><center>20</center></td>
  <td><center>21</center></td>
  <td><center>22</center></td>
  <td><center>23</center></td>
</tr>
<tr>
  <td><center>1</center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
</tr>
<tr>
   <td><center>1</center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
</tr>
<tr>
   <td><center>1</center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
</tr>
<tr>
   <td><center>1</center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
</tr>
<tr>
   <td><center>1</center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
  <td><center> </center></td>
</tr>
</table>